javascript - 在提交之前将表单中输入的值显示为表格

Question

首先，我在ajax方面没有太多天赋，所以请在回答时考虑到这一点。在这里，我想获取在提交之前插入表格表单中的所有值，但不幸的是没有得到我想要的结果。到目前为止我已经做到了这一点。请看一下。

 <script>
 var form_data={ agent_name: $('#agent_name').val(),
                    type: $('input[name="type"]').val(),
                    number: $('#number').val(),
                    quantity: $('#quantity').val()
                  }

    $.ajax({
    type: 'POST',
    url: '<?php echo base_url();?>admin_control/ajax_data',
    data: form_data,
    dataType:"json", //to parse string into JSON object,
    success: function(data){ 
        if(data){
            var len = data.length;
            alert(len);
            var txt = "";
            if(len > 0){
                for(var i=0;i<len;i++){
                    if(data[i].agent_name && data[i].type){
                        txt += $('#table').append('<tr class="item-row"><td><input type="hidden" id="add_type" name="add_type[]" value="super">Super</td><td><input type="hidden" id="add_amount" name="add_amount[]" value="10">745</td><td><input type="hidden" class="add_quantity" id="add_quantity" name="add_quantity[]" value="10">10</td><td name="add_amount" id="add_amount">100</td><td><input type="checkbox" class="add_checkbox" name="layout" id="add_checkbox" value="1" checked></td></tr>');

                    }
                }
                if(txt != ""){

                    $("#table").append(txt).removeClass("hidden");
                }
            }
        }
    },
    error: function(jqXHR, textStatus, errorThrown){
        alert('error: ' + textStatus + ': ' + errorThrown);
    }
});
return false;
</script>  

在这里，我想将 form_data 的值传递到我编写的表中，我们如何传递它，并强制在 ajax 中使用url，同时使用这个我收到了类似的错误错误:parsererror:SyntaxError:JSON.parse:JSON 数据第 1 行第 1 列出现意外字符。

这是我的 Controller

public function ajax_data()
{
  $array = array("agent_name" => "admin","number"=>"785","type"=>"super","quantity"=>"10");
  $data['json'] = $array;
  echo json_encode($data);
}

Answer 1

Ajax post 将调用 post 值的 Controller 方法。 ajax 代码通常是正确的，但您还没有定义 url。

 url: '',

首先定义一个方法(例如:HomeController)，然后设置ajax url参数，如

url: '@Url.Action("Save","Home")' 或 url: 'Save/Home'

  [HttpPost]
  public JsonResult Save(string agent_name, string type , int number,int quantity)
  {
    // return json
  }

注意:

The data types you send from the form with the method types must be the same.