javascript - Add content to div with php dynamically -
so i'm making contact form. when form submitted want add success or error message bootstrap modal.
here button submits form , opens modal.
<input class="btn btn-info" type="submit" value="submit" name="submit" data-toggle="modal" href="#contactmodal"/>
so when button clicked submits form , opens modal. there way add string of text modal dynamically upon success
or failure
of script?
here php success/failure action currently
if ($success){ print "<meta http-equiv="refresh" content="0;url=contactthanks.html">"; } else{ print "<meta http-equiv="refresh" content="0;url=error.html">"; }
but want add content modal instead of adding <meta>
tag redirects page
here modal code
<div id="contactmodal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="mymodallabel">thanks!</h3> </div> <div class="modal-body"> <p>i'm pretty busy i'll try best message <strong>asap</strong>!</p> </div> <div class="modal-footer"> <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">close</button> </div> </div>
so how print
inside of <div>
within modal without refreshing page or redirecting?
i don't know php or ajax , i'm not starting begin js , jquery (two days exact)
you cannot submit form , not have page refresh. want use ajax request php instead, return success/failure status json, use conditionally add content div javascript.
instead of form, use normal <input type="button" />
onclick="somefunction"
somefunction makes ajax call.
you want use jquery.
your php
//do submitted values if ($success){ echo json_encode(true); } else{ echo json_encode(false); }
and ajax call like
$.ajax({ type: "post", url: "dosomething.php", data: { formvalue1 = <get value using jquery>, etc... } datatype: "json", success: processdata, error: function(){ alert("failed"); } }); function processdata(data) { if(data) { $("div#divid").html("what want add inside div"); } }
Comments
Post a Comment