php - jquery ajax dynamic form with dynamic inputs only submiting the first form -
i in development phase of freelancer market dashboard.the main idea of sending offer fiverr. seller view buyer request displaying through while loop
on view request it showing model box of details of specific request on sending offer new model box appears containing seller gigs ..now here created dynamic form respect gigid ..
following js code view , submiting form
function showform(seller) { var a=seller; alert(a); $("."+a).toggle(); } function submitproposal(buyerid,gigsellerid) { var buyerid=buyerid; var gigsellerid=gigsellerid; var sellerrole = $("#sellerrole_"+gigsellerid).val(); var sellerid = $("#sellerid_"+gigsellerid).val(); var detail = $("#details_"+gigsellerid).val(); var price = $("#price_"+gigsellerid).val(); var duration = $("#duration_"+gigsellerid).val(); var revision = $("#revision_"+gigsellerid).val(); if ($("#checkbox1").is(":checked")) { var gigextra1 = $("#checkbox1").val(); } else { var gigextra1 = ''; } if ($("#checkbox2").is(":checked")) { var gigextra2 = $("#checkbox2").val(); } else { var gigextra2 = ''; } if ($("#checkbox3").is(":checked")) { var gigextra3 = $("#checkbox3").val(); } else { var gigextra3 = ''; } var gigid = $("#gigid_"+gigsellerid).val(); var datastring = 'sellerrole=' + sellerrole + '&sellerid=' + sellerid + '&buyerid=' + buyerid + '&detail=' + detail + '&price=' + price + '&duration=' + duration + '&gigextra1=' + gigextra1 + '&gigid=' + gigid + '&gigextra2=' + gigextra2 + '&gigextra3=' + gigextra3 + '&revision=' + revision; alert(datastring); if (detail === "") { document.getelementbyid("error").innerhtml ="please give details"; } else if (price === "") { alert( 'please give bugdet'); } else { $.ajax({ type: "post", url: "submitproposal.php", data: datastring, cache: false, success: function (result) { var inserted = document.getelementbyid("success").innerhtml = result; } }); } return false; } input fields dynamic id's
<?php $selectgig=mysqli_query($con,"select * freelance_gig sellerid='$sellerid'"); $count=mysqli_num_rows($selectgig); while($fetchgig=mysqli_fetch_assoc($selectgig)){ $gigsellerid=$fetchgig['id']; $gigimage=$fetchgig['image']; $title=$fetchgig['title']; ?> <ul style="border: ridge " > <a data-toggle="modal" data-gig_id="<?php echo $gigsellerid ?>" class="gigid" onclick="showform(<?php echo $gigsellerid?>)" style="text-decoration: none;color: black"> <img width="100" height="100" src="<?php echo $gigimage?>" style="margin-top: 5px;"><p><?php echo $title?></p></a> <div class="modal-body proposal <?php echo $gigsellerid?>" style="display: none;" > <div class="row"> <div class="col-md-12"> <h4>please fill following fields </h4> <p id="error" style="color: red ;font-weight: bold"></p> <p id="success" style="color: green ;font-weight: bold"></p> <ul style="border: ridge " > <div class="form-group"> <input type="text" name="gigid" id="gigid_<?php echo $gigsellerid?>" value="<?php echo $gigsellerid;?>" > <input type="text" name="buyerid" class="buyeridnew" value="<?php echo $buyerid ?>"> <input type="text" name="sellerid" id="sellerid_<?php echo $gigsellerid?>" value="<?php echo $sellerid?>" hidden > <!-- <input type="text" name="gigid" id="gigid" value="--><?php //?><!--" hidden>--> <br> <label> describe gig: </label> <input type="text" class="pull-right" style="margin-right: 20px; width:200px;height: 50px;" name="gigdescription" id="details_<?php echo $gigsellerid?>"> <br> <br> </div> <div class="form-group" > <label> price: </label> <span class="pull-right">$<input id="price_<?php echo $gigsellerid?>" type="number" style="width: 125px;margin-right: 20px;" min="5" max="5000" name="price" placeholder="maximum $5000" ></span> </div> <div class="form-group" > <label>duration </label> <select id="duration_<?php echo $gigsellerid?>" name="duration" class="pull-right" style="margin-right: 20px;"> <option value="1" selected="">1 day</option> <option value="2">2 days</option> <option value="3">3 days</option> <option value="4">4 days</option> <option value="5">5 days</option> <option value="6">6 days</option> <option value="7">7 days</option> <option value="8">8 days</option> <option value="9">9 days</option> <option value="10">10 days</option> <option value="11">11 days</option> <option value="12">12 days</option> <option value="13">13 days</option> <option value="14">14 days</option> <option value="15">15 days</option> <option value="16">16 days</option> <option value="17">17 days</option> <option value="18">18 days</option> <option value="19">19 days</option> <option value="20">20 days</option> <option value="21">21 days</option> <option value="22">22 days</option> <option value="23">23 days</option> <option value="24">24 days</option> <option value="25">25 days</option> <option value="26">26 days</option> <option value="27">27 days</option> <option value="28">28 days</option> <option value="29">29 days</option> <option value="30">30 days</option> </select> </div> <div class="form-group>"> <label> number of revisions(optional): </label> <select id="revision_<?php echo $gigsellerid?>" name="revisions" class="pull-right" style="margin-right: 20px;"> <option value="" selected="">select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="-1">unlimited</option> </select> </div> </ul> <br> <div class="form-group"> <a class="fa fa-play" onclick="showextras(_<?php echo $gigsellerid?>)" style="text-decoration: none;color: black"> gig extra's (optional) </a> <div id="extras" style="display: none;"> <ul> <li> <input type="checkbox" id="checkbox1" value="contentupload"> content upload </li> <li> <input type="checkbox" id="checkbox2" value="responsivedesign">responsive design </li> <li> <input type="checkbox" id="checkbox3" value="designcustomization">design customization </li> </ul> </div> </div> <input type="hidden" value="<?php echo $sellerrole; ?>" id="sellerrole_<?php echo $gigsellerid?>" > <input type="submit" name="submit" id="submit" class="btn green submit" onclick="submitproposal(<?php echo $buyerid;?>,<?php echo $gigsellerid; ?>)" >
by method binding event?
subsequent submission model etc. doesn't occur because event bound before element rendered. if that's case, prevent can bind event body itself.
$('body').on('click', '#button_id_dynamic', function(){ });
Comments
Post a Comment