单击模态按钮时不提交表单

时间:2018-05-19 09:12:43

标签: javascript jquery html ajax

当我点击模态更新按钮时,我在模态上有一个表单,然后它什么也没发生。

这是我的模态代码



$("#TypeValidation").on('submit', (function(e) {
    alert('enter');
    var reference = $(this).find('input[name="reference"]').val();
    var valid_date = $(this).find('input[name="valid_date"]').val();
    var description = $(this).find('select[name="description"]').val();
    var attachment = $(this).find('input[name="attachment"]').val();
    var Update_taskid = $(this).find('button[name="Update_task"]').val();
    if (description && reference && valid_date)

    {

        e.preventDefault();
        $.ajax({
            url: "../../controllers/authentication_function.php?Update_taskid=" + Update_taskid,
            type: "POST",
            data: new FormData(this),
            contentType: false,
            cache: false,
            processData: false,
            dataType: "html",
            beforeSend: function() {
                $("#Update_task").prop('disabled', 'disabled')
            },
            success: function(result) {
                alert(result);
                location.reload();
                if (result == '1') {
                    location.replace("lst_tasks.php");

                } else {
                    location.replace("lst_tasks.php");

                }
            }
        });
    }
}));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="editTasks_<?php echo $Row[$data]->id;?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
</div>
<form id="TypeValidation" action="" method="post" enctype='multipart/form-data'>
<div class="modal-body">
   <div class="row">
      <div class="col-sm-6 form-group has-label">
         <label>
         Reference
         </label>
         <input class="form-control" name="reference" type="text">
      </div>
      <div class="col-sm-3 form-group has-label">
         <label>
         Expiry Date of file
         </label>
         <input class="form-control datepicker" name="valid_date" type="text">
      </div>
   </div>
   <div class="row">
      <div class="col-sm-6 form-group has-label">
         <label>
         File Upload
         </label><br>
         <div class="fileinput fileinput-new text-center" data-provides="fileinput">
            <div class="fileinput-preview fileinput-exists thumbnail"></div>
            <div>
               <span class="btn btn-rose btn-round btn-file">
               <span class="fileinput-new">Select File</span>
               <span class="fileinput-exists">Change</span>
               <input type="file" name="attachment" id="attachment" />
               </span>
               <a href="#" class="btn btn-danger btn-round fileinput-exists" data-dismiss="fileinput"><i class="fa fa-times"></i> Remove</a>
            </div>
         </div>
      </div>
   </div>
   <div class="row">
      <div class="col-sm-12 form-group has-label">
         <label>
         Description
         </label>
         <textarea class="form-control" name="description"></textarea> 
      </div>
   </div>
</div>
<div class="modal-footer">
   <div class="pull-left">
      <button type="submit" value="Update_task" name="Update_task" id="Update_task" class="btn btn-info">Update</button>
   </div>
   <div class="pull-right">
      <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
   </div>
</div>
&#13;
&#13;
&#13;

这里是authentication_function.php代码

  <?php
if(isset($_REQUEST['Update_taskid']) && ($_REQUEST['Update_taskid']=="Update_task")){
    global $con;

         $reference = base64_encode($_REQUEST['reference']);
         $valid_date = $_REQUEST['valid_date'];
         $description = base64_encode($_REQUEST['description']);
         $cdate = date("Y-m-d H:i:s");
         $status = 1;

          //Task File  UPLOAD
         if ($_FILES['attachment']['name']!=""){
             if($_FILES['attachment']['size'] >= 1048576) {
                print "<font color='#CC0000' size='+1' style='font:bold'><strong>Image Size Out of Bound.</strong></font>";
                break;
             }

        $filePath="../uploads/task_files/";
        $file = $_FILES['attachment']['name'];
        move_uploaded_file($_FILES['attachment']['tmp_name'], $filePath.$file);

        }
         else {$file=$_SESSION['file1']; unset($_SESSION['file1']);}
                       $update_task = array("reference"=>$reference,"valid_date"=>$valid_date,"description"=>$description,"attachment"=>$file,"cdate"=>$cdate,"status"=>$status);
        $table = tbl_task_activities;

        $UpdateTask = InsertDB($update_task, $table);

        if ($UpdateTask!=''){
            $_SESSION['update_task']="update_msg";
            echo 1;
            }
            else{
                $_SESSION['error_update_task']="update_error_msg";
            echo 0;
                }
            }
          ?>

我试过了,无法解决我的错误。 plaese告诉我我做错了什么。提前致谢

2 个答案:

答案 0 :(得分:0)

试试这个。我想这会帮助你提交表格。

<script type="text/javscript">
$(function(){
     //form submit code here   
      $("#TypeValidation").on('submit', (function(e) {
          alert('enter');
       });
});
</script>

答案 1 :(得分:0)

我检查了你的代码,发现只有一个错误造成问题:

将select [name =&#34; description&#34;]更改为

 var description = $(this).find('textarea[name="description"]').val();

因为你有textarea的描述

 <textarea class="form-control" name="description"></textarea>

同时在第一行移动e.preventDefault();

$( document ).ready(function() {
  $("#TypeValidation").on('submit', (function(e) {
    e.preventDefault();

它会起作用!!