Fatal编程技术网
  • javascript/
  • Javascript 当我点击查看页面中的任何按钮时，表单被提交

Javascript 当我点击查看页面中的任何按钮时，表单被提交

javascript php jquery forms codeigniter

Javascript 当我点击查看页面中的任何按钮时，表单被提交,javascript,php,jquery,forms,codeigniter,Javascript,Php,Jquery,Forms,Codeigniter,嗨，我在我的查看页面中使用codeigniter，我有一个按钮来动态添加表行，还有一个表单提交按钮。当我点击“添加”按钮时，我的表单被提交。如何在单击“添加”按钮时停止表单提交，以及如何在单击“实际提交”按钮时使表单提交 <html> <head> <meta charset="UTF-8"> <link href="<?php echo base_url(); ?>assets/css/elfanto_css.css" rel="

嗨，我在我的查看页面中使用codeigniter，我有一个按钮来动态添加表行，还有一个表单提交按钮。当我点击“添加”按钮时，我的表单被提交。如何在单击“添加”按钮时停止表单提交，以及如何在单击“实际提交”按钮时使表单提交

<html>

<head>
  <meta charset="UTF-8">

 <link href="<?php echo base_url(); ?>assets/css/elfanto_css.css" rel="stylesheet">
  <link href="<?php echo base_url(); ?>assets/css/style.css" rel="stylesheet">
  <link href="<?php echo base_url(); ?>assets/css/demo.css" rel="stylesheet">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type='text/javascript' src='//code.jquery.com/jquery-compat-git.js'></script>


<script type='text/javascript'>
var baseurl='<?php echo base_url(); ?>';
$(function() {
    $('#test').on('change', 'input[name="pid[]"]', function() {
        var indexOfTheChangedRow = $(this).closest("tr").index();
        get_values(this.value, indexOfTheChangedRow);
    });
});


function get_values(val,rowIndex)
{
 $.ajax({
    url: baseurl + 'admin/billing/getdetails',
    type: 'post',
    data: {
        val: val
    },
    success: function (indexOfTheChangedRow, response) {
        if (response != "") {
            var json = jQuery.parseJSON(response),
                rowToUpdate = $("#test tr:nth-child(" + (indexOfTheChangedRow + 1) + ")");

            // add the changed row as the context to restrict the search for the classes to this one row only
            $('.description', rowToUpdate).val(json.description);
            $('.type', rowToUpdate).val(json.type);
            $('.qty_used', rowToUpdate).val(json.qty_used);
             $('.qty_prch', rowToUpdate).val(json.qty_prch);

        }
    }.bind(window, rowIndex),
    error: function (response) {
        alert("error");
    }
});
}
function loadgrandtotal() {
    var sum = 0;
    $('.subtot').each(function () {
        var prodprice = Number($(this).text());
        sum = sum + prodprice;
    });
    $("#totalrst").text(sum.toFixed(2));
}


function displayResult() {
<?php

      $attributes = array('class' => 'form-horizontal', 'id' => '');
      $options_employee = array('' => "Select");
      foreach ($employee as $row)
      {
        $options_employee[$row['first_name']] = $row['first_name'];
      }
    $dropdown = form_dropdown('employee', $options_employee, set_value('employee[]'), 'class="span2"');

      ?>

    var complex = <?php echo json_encode($dropdown); ?>;

    var row = document.getElementById("test").insertRow(-1);
    row.innerHTML = '<td><div>'+complex+'</div></td><td><input type="text" name="start_time[]" value="" style="width:35px;"/></td><td><input type="text" name="pid[]" style="width:35px;"/></td><td><input type="text" name="description[]" class="description" value="" style="width:145px;"/></td><td><input type="text" class="type" value="" style="width:45px;"/></td><td><input type="text" class="qty_prch" value="" style="width:45px;"/></td><td><input type="text" class="qty_used" value="" style="width:45px;"/></td><td><input type="text" value="" style="width:70px;"/></td><td><input type="text" value="" style="width:70px;"/></td><td><input type="text" value="" style="width:70px;"/></td><td class="subtot"><input type="text" value="" style="width:70px;"/></td>';
}
</script>
</head>
<body bgcolor="#CCCCCC">
            <p><img src="../assets/img/ticket_page/Client.svg">   <input type="text" value=""/></p> 
                    <!-- Your Content Here -->
                        <?php

      $attributes = array('class' => 'form-horizontal', 'id' => '');
      $options_employee = array('' => "Select");
      foreach ($employee as $row)
      {
        $options_employee[$row['first_name']] = $row['first_name'];
      }
 echo form_open('admin/employee/add');  /*I open my form here*/
      ?>
            <div id="form"> 
             <!-- div form starts here.its for add table  -->
            <table id="test">
            <thead>
            <tr>
            <td style="width:80px;"><img src="../assets/img/ticket_page/employee.svg"></td>
            <td style="width:35px;"><img src="../assets/img/ticket_page/start_time.svg"></td>
            <td style="width:35px;"><img src="../assets/img/ticket_page/id.svg"></td>
            <td style="width:145px;"><img src="../assets/img/ticket_page/Description.svg"></td>
            <td style="width:45px;"><img src="../assets/img/ticket_page/Type.svg"></td>
            <td style="width:45px;">  <img src="../assets/img/ticket_page/qty_prch.svg"></td>
            <td style="width:45px;">   <img src="..assets/img/ticket_page/qty_used.svg"></td>
            <td style="width:70px;"> <img src="../assets/img/ticket_page/Price.svg"></td>
            <td style="width:70px;"> <img src="../assets/img/ticket_page/discount.svg"></td>
            <td style="width:70px;"> <img src="../assets/img/ticket_page/Tax.svg"></td>
            <td style="width:70px;"> <img src="../assets/img/ticket_page/Total_01.svg"></td>
            </tr>
            </thead>
            <tbody>
            <tr>
            <td><?php echo form_dropdown('employee', $options_employee, set_value('employee[]'), 'class="span2"');?></td>
            <td><input type="text" name="start_time[]" value="" style="width:35px;"/></td>
            <td><input type="text" name="pid[]"  value="" style="width:35px;"/></td>
            <td><input type="text" name="description[]" class="description" value="" style="width:145px;"/></td>
            <td><input type="text" name="type[]" class="type" style="width:45px;"/></td>
            <td><input type="text" name="qty_prch[]" class="qty_prch" style="width:45px;"/></td>
            <td><input type="text" name="qty_used[]" class="qty_used" style="width:45px;"/></td>
            <td><input type="text" name="price[]" class="price" style="width:70px;"/></td>
            <td><input type="text" name="discount[]" class="discount" style="width:70px;"/></td>
            <td><input type="text" name="tax[]" class="tax" style="width:70px;"/></td>
            <td class="subtot"><input type="text" name="total[]" class="total" style="width:70px;"/></td>

            </tr>
            </tbody>



            </table>

            <div id="add_row">
        <button onClick="displayResult()" class="add_r"></button>
                </div>  
<button id="btn" type="submit">SAVE</button>/*this my actual submit button*/
            <button id="btn" type="reset">CANCEL</button>



        <?php echo form_close(); ?>  /*Here I close my form*/       
    </body>
</html>
有人能帮我吗？我只需要在单击“提交”按钮时提交表格。请帮我解决这个问题。

为按钮指定type属性，这样当事件处理程序中发生异常时，按钮就不会触发提交操作

您正在使用HTML5按钮元素。记住这个按钮的默认行为是提交类型的原因，如W3规范所述。签出

您确实可以更改submit to'type'按钮，但如果您以后仍想使用submit提交表单，请不要更改它。 要防止默认情况下提交表单，请添加到Javascript：

$("form").submit(function(e) {
    e.preventDefault();
}
如果你仍然想提交表单，你可以将默认值放在If语句中。

@Akki619是的，我刚刚提交了！我不明白为什么一开始就投了反对票？这个问题错了吗？是什么让它否决了投票？我同意你的答案，它对我非常有用@psylogic，我没有否决任何答案。请验证我的配置文件为什么使用preventDefault？它的用途是什么？当单击submit按钮时，preventDefault会在默认情况下停止表单的提交。 
$("form").submit(function(e) {
    e.preventDefault();
}