duandao2306 2017-03-13 23:31
浏览 52
已采纳

如何使用jQuery将表单数据添加到同一页面中的引导模式?

I have a requirement and trying to write code for Where user enters/selects some information in form then clicks on Submit button then a popup window(bootstrap modal) appears with just one single input box where user just types a name for that selection. What I am doing here is once user gives some information in form & after clicks on submit button I am storing that form before popup modal opens(in the middle of after user clicks on submit button and a popup window opens I am storing the given form inputs and fetching that last inserted record id and binding that id to a hidden input field in the popup modal), after popup window opens user types a name and clicks on Save button then I will be updating that record by using the same record id. The problem Am facing here is after user enters all form data and he clicks on submit button I am storing this data in the database before a popup window opens, after popup window opens in popup window if user clicks on close or Esc button without giving a name then that form data is already saved with empty name becoz user didn't give a name in popup box because as he clicks on 'close' or 'Esc' button but my requirement is if user doesn't give a name then that record shouldn't be stored in the database.

My Form code:

<form method="post" action="" id="my_form_id" class="my_form_class"> 
 <div class="col-md-6 col-sm-6 col-xs-12">
     <input type="radio" name="my_input_name_116" class="all select_option" data-id="116" value="all">
     <label for="all">All</label>
     <input type="radio" name="my_input_name_116" class="yes select_option" data-id="116" value="yes">
     <label for="yes">Yes</label>
     <input type="radio" name="my_input_name_116" class="no select_option" data-id="116" value="no" checked>
      <label for="no">No</label>
 </div>
<button type="button" class="btn btn-success" data-toggle="modal" data-target="#rsModal" data-backdrop="static" data-keyboard="false" id="save_run_setup">SAVE RUN SETUP</button>

My bootstrap modal code:

<div class="modal fade" id="rsModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <!--<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>-->
                <h4 class="modal-title" id="myModalLabel">Run Setup Name</h4>
            </div>
            <div class="modal_failure run_setup_error">
                <p><span class="add_failure_msg"></span></p>
            </div>
            <div class="popup_success run_setup_success">
                <p><span class="add_success_msg"></span></p>
            </div>
            <form method="post" action="" id="add_rs_modal">
                <div class="modal-body">
                    <input type="hidden" class="form-control modal_user_id" id="user_id" name="user_id" value="">
                    <input type="hidden" class="form-control modal_rs_row_id" id="rs_row_id" name="rs_row_id" value="">
                    <div class="form-group">
                        <!--<label for="module-name">Run setup name</label>-->
                        <input type="text" class="form-control modal_runsetup_name" name="modal_runsetup_name" placeholder="Enter Run Setup Name" value="" required>
                    </div>
                </div>
                <div class="modal-footer">
                    <!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>-->
                    <button type="button" class="btn btn-success" class="add_runsetup_name" id="add_runsetup_name">Save Run Setup</button>
                </div>
            </form>
        </div>
    </div>
</div>

My question here is how to carry the form input data along with a name which user is going to give in the popupbox, if user doesn't give a name then I will not save that previous form data? Any help would be appreciated.

Edited :

What I am doing is after user gives the input to the form "my_form_id" he clicks on 'save_run_setup' button then in ajax call I am storing this form values into a table and getting the last inserted row id and putting that row id in popup modal(which opens after this ajax call) asking user to enter a name for this form selection and updating that revious record with this 'name' given in modal popup. But If user doesn't give a any name then I already saved a record after user clicks on 'Save Run Setup' button. My requirement is I have to either append 'my_form_id' form data to bootstrap modal or modal input value to this form.

展开全部

  • 写回答

1条回答 默认 最新

  • duandi8613 2017-03-14 03:42
    关注

    If I got you correct

    my requirement is if user doesn't give a name then that record shouldn't be stored in the database.

    with bootstrap modal close event and validate the input field you can make sure that if user does't fill the input field either modal remain open and show a message and if user fill the input field you can run an Ajax call to add the data to database or do what ever you like to do with it....

    $('#rsModal').on('hide.bs.modal', function() {
      var UserName = $("#modal_runsetup_name").val();
      if (UserName == '') {
        alert('Enter User Name');
        return false;
      } else {
        alert('do what ever you like to do');
      }
    });
    

    Note you don't need "Save Run Setup" button in modal, modal close button will take care of everything.

    Fiddle Example

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
编辑
预览

报告相同问题?

悬赏问题

  • ¥15 关于#c##的问题:treenode反序列化后获取不到上一节点和下一节点,Fullpath和Handle报错
  • ¥15 一部手机能否同时用不同的app进入不同的直播间?
  • ¥15 没输出运行不了什么问题
  • ¥20 输入import torch显示Intel MKL FATAL ERROR,系统驱动1%,: Cannot load mkl_intel_thread.dll.
  • ¥15 点云密度大则包围盒小
  • ¥15 nginx使用nfs进行服务器的数据共享
  • ¥15 C#i编程中so-ir-192编码的字符集转码UTF8问题
  • ¥15 51嵌入式入门按键小项目
  • ¥30 海外项目,如何降低Google Map接口费用?
  • ¥15 fluentmeshing