堆栈内存溢出
  繁体   English   中英

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

[英]When I click any button in my view page the form is submitted

 原文  2015-09-21 10:17:45  8   2    javascript/ php/ jquery/ forms/ codeigniter

问题描述

嗨，我正在使用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>

有人能帮我吗？ 我仅在单击提交按钮时才需要提交表单。 请帮我解决。

2 个解决方案

解决方案1
 2 已采纳  2015-09-21 10:19:46

将type属性赋予您的按钮，当事件处理程序中发生异常时，可以阻止它们触发提交操作。

您正在使用HTML5按钮元素。 还记得提交类型，如W3 Specification.Check说，它是这个按钮与默认行为的原因这一出。 

<button type="button" onClick="displayResult()" class="add_r"></button>

解决方案2
 0  

您确实可以将提交更改为“类型”按钮，但是如果您以后仍想使用提交表单来提交表单，请不要对其进行更改。 为了防止默认情况下提交表单，请添加到Javascript： 

$("form").submit(function(e) {
    e.preventDefault();
}

如果仍然要提交表单，则可以将preventDefault放在if语句内。

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 表格未按钮点击提交 如何在提交表单时没有任何错误地禁用提交按钮 当我单击表单提交按钮时，为什么不进入下一页？ 单击按钮时如何防止我的页面呈现 当我单击下拉按钮时，我的页面会自动重新加载 表单在按钮单击时提交两次 提交表单时，我需要将 iframe 重定向到不同的页面 提交表单后，如何重置某些字段？ 提交时如何清除我的反应表单？ 提交按钮上发生点击事件时，表单未提交
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM