javascript - Loading image being displayed only on the 1st result in while loop -
loading image being displayed below button of 1st result in while loop no matter button clicked result. example, if click submit button on first result loading image displayed below it. that's okay. when click on submit button of other result except first loading image displayed below first result , not below submit button of particular result.
<?php while($a = $stmt->fetch()){ ?> <form method="post" action=""> <input type="hidden" value="<?php echo $mbs_id; ?>" class="memid"> <select class="validity" class="upgrade-valsel"> <?php while($mv = $mval->fetch()){ extract($mv); ?> <option value="<?php echo $mv_id; ?>"><?php echo $mv_validity; if($mv_validity == 1){ echo " month"; }else{ echo " months"; } ?></option> <?php } ?> </select> <input type="submit" value="upgrade" class="submit"> <div class="center-align" style="margin-left: -20px"><img src="images/loading.gif" width="auto" id="loading-rent" style="margin-right: 0px; height: 40px"></div> </form> <?php } ?> script
$(document).ready(function() { $(".submit").click(function () { var datastring = { memid: $(this).parent().find(".memid").val(), memname: $(this).parent().find(".memname").val(), validity: $(this).parent().find(".validity").val() }; $.confirm({ title: 'confirm!', content: 'are sure want upgrade membership ' + datastring.memname + '?', buttons: { confirm: function () { $.ajax({ type: "post", datatype: "json", url: "upgrade-process.php", data: datastring, cache: true, beforesend: function () { $("#submit").hide(); $("#loading-rent").show(); $(".message").hide(); }, success: function (json) { settimeout(function () { $(".message").html(json.status).fadein(); $("#submit").show(); $("#loading-rent").hide(); }, 1000); } }); }, cancel: function () { $.alert('<span style="font-size: 23px">upgrade cancelled!</span>'); } } }); return false; }); });
use .classes when comes generating number of elements loop.
use #id unique elements.
to fix code following:
- add , fix missing class
- replace id attributes in code class
- use event delegation listen click event on submit button. read following: jquery api docs on event delegation
Comments
Post a Comment