Friday, 15 May 2015

javascript - Insert data in database when corresponding check box is selected using Jquery, Ajax and JSON -



javascript - Insert data in database when corresponding check box is selected using Jquery, Ajax and JSON -

i have little form couple of check boxes , hidden div opens when user check corresponding box. want utilize ajax , json insert info in database when speccific date checked , insert time in database inserted hidden div. possible? here form: on jsfiddle

<div> <input type="checkbox" name="monday" id="mon" class="toggler" /> mon <input type="checkbox" name="tuesday" id="tue" class="toggler" />tuesday <input type="checkbox" name="wendsday" id="wen" class="toggler"/> wendsday <input type="checkbox" name="thursday" id="thu" class="toggler" /> th <input type="checkbox" name="friday" id="fri" class="toggler" /> fri <input type="checkbox" name="saturday" id="sat" class="toggler" /> saturday <input type="checkbox" name="sunday" id="sun" class="toggler" /> sunday </div> <div id="name" class="hidden" style="display: none"> time from::<input type="text" id="place" placeholder=""></input> time to::<input type="text" id="place_one" placeholder=""></input> <input type="button" onclick="save_time();" value="save" /> </div>

here javascript:

$(function(){ $('.toggler').click(function(id){ if (this.checked) { $('#name').slidedown(); } else { $('#name').slideup(); } }); save_time = function(days){ $.ajax({ type: "post", url: "", data: "days="+days, success: function(data){ } }); $('#name').slideup(); }; });

i changed few things in fiddle correctly pass 'day' + added 'from' , 'to' values post data. also, 1 day can selected @ 1 time because guessed required logic.

updated fiddle.

$(function(){ $('.toggler').click(function(id){ $('.toggler').not('#' + $(this).attr('id')).attr('checked', false); if (this.checked) { $('#name').slidedown(); } else { $('#name').slideup(); } }); save_time = function(){ var id = $('.toggler:checked').attr('id'); $.ajax({ type: "post", url: "url", data: {day: id, from: $('#place').val(), to: $('#place_one').val()}, success: function(data){ } }); $('#name').slideup(); }; });

javascript ajax json checkbox

No comments:

Post a Comment