2013-05-15 261 views
0

因此,我正在制作联系表单。提交表单时,我想向Bootstrap模式添加成功或错误消息。动态地将内容添加到div

这是提交表单并打开模式的按钮。

<input class="btn btn-info" type="submit" value="Submit" name="Submit" data-toggle="modal" href="#contactModal"/> 

所以当按钮被点击时,它会提交表单并打开模式。有没有办法在脚本的successfailure上动态地向模态添加文本字符串?

这里是PHP成功/失败的行动目前

if ($success){ 
print "<meta http-equiv="refresh" content="0;URL=contactthanks.html">"; 
} 
else{ 
    print "<meta http-equiv="refresh" content="0;URL=error.html">"; 
} 

但我想它的内容添加到模式不是添加<meta>标记,重定向的页面

这里是模态码

<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 sometimes but I'll try my best to message you back <strong>ASAP</strong>!</p> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Close</button> 
    </div> 
</div> 

那么我怎么会print<div>里面的模式没有刷新e页面还是重定向?

我不知道任何PHP和AJAX和我只是没有开始开始JS和jQuery(两天准确)

回答

4

不能提交表单,并没有刷新页面。你最可能要做的就是使用AJAX请求到你的php,它会以JSON的形式返回成功/失败状态,然后你将使用它来有条件地用javascript添加内容到你的div。

而不是表单,您将只使用正常<input type="button" />onclick="someFunction"其中someFunction进行AJAX调用。

你会想要使用jQuery。

你的PHP看起来像

//do something with submitted values 

if ($success){ 
    echo json_encode(True); 
} 
else{ 
    echo json_encode(False); 
} 

和AJAX调用会是这样的

$.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 you want to add inside the div"); 
    } 
}