javascript - Issue with Jquery load functionality -
i trying run page jquery functionality insside it, happening when ajax post, shows me message in alert box , afterwards reloads whole page 1 time again , unable run 1 time again , @ point shows error
$fancybox in undefined, shows t undefined but other functionality update page 1 time again not work. here below code tried
<html> <head> <title>view images</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript" src="/js/fancybox/jquery.fancybox-1.3.4.pack.js"></script> <script type="text/javascript" src="/js/fancybox/jquery.easing-1.3.pack.js"></script> <script type="text/javascript" src="/js/fancybox/jquery.mousewheel-3.0.4.pack.js"></script> <link rel="stylesheet" type="text/css" href="/js/fancybox/jquery.fancybox-1.3.4.css"> <script type="text/javascript"> $(document).ready(function() { $("a.zoom2").fancybox({ 'zoomspeedin' :500, 'zoomspeedout' :500, 'overlayshow' :false, 'width' :800, 'height' :600 }); $(".mychecks").click(function(e) { var info = $("#frmimages").serialize(); var mainid = $("#mainid").val(); $.ajax({ type:"post", url:"actionimages.cfm?action=update", cache:false, data:data, success:function(html) { var = $("#msg").html(html).text().replace('/\s+/g', ' '); alert(i); $('#reloadimages').load('viewimages.cfm?id=' + mainid + '&user=myname'); } }); }); }); function checkboxes(theelement) { var theform = theelement.form, z = 0; for(z=0; z<theform.length;z++){ if(theform[z].type == 'checkbox' && theform[z].name != 'checkall'){ theform[z].checked = theelement.checked; } } } </script> </head> <body style="background:white;"> <div id="reloadimages"> <form name="frmimages" id="frmimages"> <table align="center" width="100%" cellpadding="1" cellspacing="2"> <tr> <td colspan="4" align="center"><div style="display:none;" id="msg"></div></td> </tr> <tr> <td colspan="4" align="left" class="blackbold20"><strong>view images</strong></td> </tr> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-freshy_fresh_oval_oval.jpg"> <img src="/small/5643.jpg" border='0'></a><br> <a title="delete image - 5643.jpg" style="cursor:pointer;" id="del~47780~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47780" id="display_1_47780" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47780" id="display_0_47780" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47780" id="submitter_47780"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" selected="selected">cdm</option> </select> <br> header image <select name="headerimage_47780" id="headerimage_47780"> <option value="0" >no</option> <option value="1" selected="selected">yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-chrysanthemum_13d4294a55.jpg"> <img src="/small/5643-chrysanthemum_13d4294a55.jpg" border='0'></a><br> <a title="delete image - 5643-chrysanthemum_13d4294a55.jpg" style="cursor:pointer;" id="del~47787~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47787" id="display_1_47787" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47787" id="display_0_47787" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47787" id="submitter_47787"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" selected="selected">cdm</option> </select> <br> header image <select name="headerimage_47787" id="headerimage_47787"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-desert_73a8b513fa.jpg"> <img src="/small/5643-desert_73a8b513fa.jpg" border='0'></a><br> <a title="delete image - 5643-desert_73a8b513fa.jpg" style="cursor:pointer;" id="del~47788~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47788" id="display_1_47788" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47788" id="display_0_47788" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47788" id="submitter_47788"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" selected="selected">cdm</option> </select> <br> header image <select name="headerimage_47788" id="headerimage_47788"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-hydrangeas_b1ae8a300e.jpg"> <img src="/small/5643-hydrangeas_b1ae8a300e.jpg" border='0'></a><br> <a title="delete image - 5643-hydrangeas_b1ae8a300e.jpg" style="cursor:pointer;" id="del~47789~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47789" id="display_1_47789" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47789" id="display_0_47789" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47789" id="submitter_47789"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" selected="selected">cdm</option> </select> <br> header image <select name="headerimage_47789" id="headerimage_47789"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <span class="dropdownb"> </tr> </span> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-jellyfish_bfeb8f8d8f.jpg"> <img src="/small/5643-jellyfish_bfeb8f8d8f.jpg" border='0'></a><br> <a title="delete image - 5643-jellyfish_bfeb8f8d8f.jpg" style="cursor:pointer;" id="del~47790~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47790" id="display_1_47790" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47790" id="display_0_47790" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47790" id="submitter_47790"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" >cdm</option> </select> <br> header image <select name="headerimage_47790" id="headerimage_47790"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-koala_3bf9d36d8f.jpg"> <img src="/small/5643-koala_3bf9d36d8f.jpg" border='0'></a><br> <a title="delete image - 5643-koala_3bf9d36d8f.jpg" style="cursor:pointer;" id="del~47791~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47791" id="display_1_47791" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47791" id="display_0_47791" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47791" id="submitter_47791"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" selected="selected">cdm</option> </select> <br> header image <select name="headerimage_47791" id="headerimage_47791"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-lamborghini-82a_05f51070ab.jpg"> <img src="/small/5643-lamborghini-82a_05f51070ab.jpg" border='0'></a><br> <a title="delete image - 5643-lamborghini-82a_05f51070ab.jpg" style="cursor:pointer;" id="del~47792~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47792" id="display_1_47792" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47792" id="display_0_47792" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47792" id="submitter_47792"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" >cdm</option> </select> <br> header image <select name="headerimage_47792" id="headerimage_47792"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-lighthouse_5d01293fff.jpg"> <img src="/small/5643-lighthouse_5d01293fff.jpg" border='0'></a><br> <a title="delete image - 5643-lighthouse_5d01293fff.jpg" style="cursor:pointer;" id="del~47793~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47793" id="display_1_47793" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47793" id="display_0_47793" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47793" id="submitter_47793"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" >cdm</option> </select> <br> header image <select name="headerimage_47793" id="headerimage_47793"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <span class="dropdownb"> </tr> </span> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-penguins1_714bcabe16.jpg"> <img src="/small/5643-penguins1_714bcabe16.jpg" border='0'></a><br> <a title="delete image - 5643-penguins1_714bcabe16.jpg" style="cursor:pointer;" id="del~47794~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47794" id="display_1_47794" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47794" id="display_0_47794" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47794" id="submitter_47794"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" selected="selected">cdm</option> </select> <br> header image <select name="headerimage_47794" id="headerimage_47794"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-sameera-reddy-77a_1c7f77be41.jpg"> <img src="/small/5643-sameera-reddy-77a_1c7f77be41.jpg" border='0'></a><br> <a title="delete image - 5643-sameera-reddy-77a_1c7f77be41.jpg" style="cursor:pointer;" id="del~47795~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47795" id="display_1_47795" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47795" id="display_0_47795" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47795" id="submitter_47795"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" selected="selected">cdm</option> </select> <br> header image <select name="headerimage_47795" id="headerimage_47795"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <td height="30" valign="middle" class="dropdownb"><a class="zoom2" rel="group" title="bigger image" href="/small/5643-tulips_f832f5324b.jpg"> <img src="/small/5643-tulips_f832f5324b.jpg" border='0'></a><br> <a title="delete image - 5643-tulips_f832f5324b.jpg" style="cursor:pointer;" id="del~47796~5643" class="del">[x]</a> <br> show image: yes <input type="radio" name="display_47796" id="display_1_47796" checked="checked" value="1" title="check radio show image on front end screen"> no <input type="radio" name="display_47796" id="display_0_47796" value="0" title="check radio not show image on front end screen"> <br> <br> <select name="submitter_47796" id="submitter_47796"> <option value="none" selected="selected">(select one)...</option> <option value="cdm" >cdm</option> </select> <br> header image <select name="headerimage_47796" id="headerimage_47796"> <option value="0" selected="selected">no</option> <option value="1" >yes</option> </select></td> <input type="hidden" name="mainid" value="5643" id="mainid"> <input type="hidden" name="updmode" id="updmode" value="codes"> <tr> <td colspan="4" align="left"><input type="button" name="update" value="update" class="mychecks" ></td> </tr> </table> </form> </div> </body> </html>
after submit info via ajax, reload dom $('.mychecks') , other direct element references useless because deleted them saying $('#reloadimages').load(...)
to prepare this, replace of $('selector').event() $(document).on('event', 'selector', function() {...}); , same non-event ones utilize .find('selector') instead of .on('event'...etc) of course.
example:
$(".mychecks").click(function(e) { turns into
$(document).on('click', '.mychecks', function(e) { and this
$("#frmimages").serialize(); can this
$(document).find('#frmimages').serialize(); you should upgrade jquery more current (at to the lowest degree >1.7) functionality give here. can replace event ones .delegate() @ point .on() has superseded it.
i must advise against of this (even if works) because method very sloppy , lead someone's browser crashing on old pc, etc. need update each element individually , instead of grabbing whole webpage using ajax, grab actual data needed using json or other manageable format.
this create life much simpler , info manipulation , display snap you.
javascript jquery ajax
No comments:
Post a Comment