doudun2212 2016-05-11 22:33
浏览 46
已采纳

单击使用ajax提交后关闭显示模式对话框

I have problem with reveal modal from zurb-foundation.

the modal dialog doesn't disappear after I click the submit button .

so it stays open after clicking the submit, and there's no way to close it unless if I refresh the page.

This's the reveal modal

    <div class="insert_post" data-open="add_post">
     <i class="fa fa-plus" ></i>
 </div>

 <div class="small reveal" id="add_post" data-reveal-id="myModal" data-reveal >
<?php
     $output .='


         <div class="row">
             <div class="medium-6 columns">
                 <label>First name
                     <input type="text"  id="first_name" contenteditable>
                 </label>
             </div>
             <div class="medium-6 columns">
                 <label>Last name
                     <input type="text"  id="last_name" contenteditable>
                 </label>
             </div>
              <button type="button" name="btn_add" id="btn_add" class="button btn btn-xs btn-success" >Submit</button> 
         </div>






     ';
     echo $output; ?>
     <button class="close-button" data-close aria-label="Close modal" type="button">
         <span aria-hidden="true">&times;</span>
     </button>
 </div>

Jquery/ajax code to insert into the database.

$(document).ready(function(){
    function fetch_data()
    {
        $.ajax({
            url: "includes/home.php",
            method:"POST",
            success:function(data){
                $('#container').html(data);
            }
        });
    }
    fetch_data();
    $(document).on('click', '#btn_add', function(){
        var first_name = $('#first_name').val();
        var last_name = $('#last_name').val();

        $.ajax({
            //url:"includes/widgets/insert.php",
            method:"POST",
            data:{first_name:first_name, last_name:last_name},
            dataType:"text",
            success:function(data)
            {
                //alert(data);
                fetch_data();
            }
        })

    });

});
</script>

Picture of the problem http://s32.postimg.org/yqbuz1rvp/wewewewe.png. after I submit the form!

  • 写回答

1条回答 默认 最新

  • douge3113 2016-05-12 07:26
    关注

    You can close the modal by JavaScript in the success call back.

    $("#add_post").foundation('close');
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥50 MATLAB APP 制作出现问题
  • ¥15 wannier复现图像时berry曲率极值点与高对称点严重偏移
  • ¥15 利用决策森林为什么会出现这样·的问题(关键词-情感分析)
  • ¥15 DispatcherServlet.noHandlerFound No mapping found for HTTP request with URI[/untitled30_war_e
  • ¥15 使用deepspeed训练,发现想要训练的参数没有梯度
  • ¥15 寻找一块做为智能割草机的驱动板(标签-stm32|关键词-m3)
  • ¥15 信息管理系统的查找和排序
  • ¥15 基于STM32,电机驱动模块为L298N,四路运放电磁传感器,三轮智能小车电磁组电磁循迹(两个电机,一个万向轮),怎么用读取的电磁传感器信号表示小车所在的位置
  • ¥15 如何解决y_true和y_predict数据类型不匹配的问题(相关搜索:机器学习)
  • ¥15 PB中矩阵文本型数据的总计问题。