【问题标题】:Json value not show in textbox using mvc使用mvc的文本框中不显示Json值
【发布时间】:2018-01-04 10:15:07
【问题描述】:

JSON 数据不显示在文本中,我创建了一个 json 函数,它返回表数据函数运行良好,函数没有错误。
现在函数执行成功时使用 json 调用函数然后空白屏幕显示不显示任何数据。
当我将var Mname 放入alert(Mname) 时,数据会在我返回表单控制器时显示。

var Mname = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(TempData["Iname"]));
alert(Mname);
$(function() {

  $.ajax({
    type: "POST",
    url: '@Url.Action("MemberInformation_Detail")',
    data: Mname,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: OnSuccess,
    failure: function(response) {
      alert(response.d);
    },
    error: function(response) {
      alert(response.d);
    }
  });

  function OnSuccess(response) {


    var table = $("#dvCustomers table").eq(0).clone(true);
    var customers = response;

    $("#dvCustomers table").eq(0).remove();
    $(customers).each(function() {
      $(".MemberID", table).val(this.MemberShipID);
      $(".name", table).val(this.name);
      $(".FName", table).val(this.FName);
      $(".Gender", table).val(this.Gender);
      $(".address", table).val(this.address);
      $(".phone1", table).val(this.phone1);
      $(".mobileno", table).val(this.mobileno);
      $(".email", table).val(this.email);
      //$(".ClientPic", table).val(this.ClientPic);

      //alert(this.ClientPic);

      $(".ClientPic", table).attr("src", "data:image/png;base64," + this.ClientPic);



      $("#dvCustomers").append(table).append("<br />");
      table = $("#dvCustomers table").eq(0).clone(true);
    });
  }
});
<form id="form1" action="">
  <div id="dvCustomers">
    <table class="tblCustomer" cellpadding="2" cellspacing="0" border="1">
      <tr>
        <th>
          <b><u><span class="name"></span></u></b>
        </th>
      </tr>
      <tr>
        <td>

          <b>MemberShipID: </b> <input type="text" class="MemberID" /><br />
          <b>name </b> <input type="text" class="name" /><br />
          <b>FName: </b><input type="text" class="FName" /><br />
          <b>Gender: </b><input type="text" class="Gender" /><br />
          <b>address: </b><input type="text" class="address" /><br />
          <b>phone1: </b><input type="text" class="phone1" /><br />
          <b>mobileno: </b><input type="text" class="mobileno" /><br />
          <b>email: </b><input type="text" class="email" /><br />
          <b>Client Pic: </b><input type="image" class="ClientPic" /><br /> 
          <div>
            
              alt="Red dot" />
          </div>
          <b>Client Pic: </b><img class="ClientPic" alt="" src="data:image/png;base64," />*@
        </td>
      </tr>
    </table>
  </div>
</form>

【问题讨论】:

  • 我认为您使用了错误的 .each 版本。该版本应该迭代包含 HTML 元素的 jQuery 对象,而不是标准数组/对象。请改用api.jquery.com/jquery.each
  • ADyson 我哪里错了请你解释一下。
  • 你使用了错误的 .each 版本,就像我说的那样。查看文档以了解差异。
  • 无论如何,我强烈建议您尽可能避免使用 global 变量。您当前的代码包含 global 变量 Mname,该值可能会被 JavaScript 代码的其他部分覆盖。您应该将行 var Mname = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(TempData["Iname"])); inside of $(function() {...}); 块移动。

标签: c# jquery asp.net ajax asp.net-mvc


【解决方案1】:

编辑

我已经在我的机器上测试了这段代码,它工作正常,我希望它也对你有用。

查看

    <form id="form1" action="">
        <div id="dvCustomers">
            <table class="tblCustomer" cellpadding="2" cellspacing="0" border="1">
                <tr>
                    <th>
                        <b><u><span class="name"></span></u></b>
                    </th>
                </tr>
                <tr>
                    <td>

                        <b>MemberShipID: </b> <input type="text" class="MemberID" /><br />
                        <b>name </b> <input type="text" class="name" /><br />
                        <b>FName: </b><input type="text" class="FName" /><br />
                        <b>Gender: </b><input type="text" class="Gender" /><br />
                        <b>address: </b><input type="text" class="address" /><br />
                        <b>phone1: </b><input type="text" class="phone1" /><br />
                        <b>mobileno: </b><input type="text" class="mobileno" /><br />
                        <b>email: </b><input type="text" class="email" /><br />
                        <b>Client Pic: </b><input type="image" class="ClientPic" /><br />
                        <b>Client Pic: </b><img class="ClientPic" alt="" src="data:image/png;base64," />
                    </td>
                </tr>
            </table>
        </div>
    </form>
    <script>
        var Mname = '@Html.Raw(Json.Encode(TempData["Iname"]))';
        alert(Mname);
        $(function () {

            $.ajax({
                type: "POST",
                url: '@Url.Action("MemberInformation_Detail")',
                data: JSON.parse(Mname),
                success: OnSuccess,
                failure: function (response) {
                    alert(response.d);
                },
                error: function (response) {
                    alert(response.d);
                }
            });

            function OnSuccess(response) {

                debugger
                var table = $("#dvCustomers table").eq(0).clone();
                var customers = response;

                $("#dvCustomers table").eq(0).remove();
                $(customers).each(function (index,item) {
                    $(".MemberID", table).val(item.MemberShipID);
                    $(".name", table).val(item.name);
                    $(".FName", table).val(item.FName);
                    $(".Gender", table).val(item.Gender);
                    $(".address", table).val(item.address);
                    $(".phone1", table).val(item.phone1);
                    $(".mobileno", table).val(item.mobileno);
                    $(".email", table).val(item.email);
                    //$(".ClientPic", table).val(this.ClientPic);

                    //alert(this.ClientPic);

                    $(".ClientPic", table).attr("src", "data:image/png;base64," + item.ClientPic);



                    $("#dvCustomers").append(table).append("<br />");
                    table = $("#dvCustomers table").eq(0).clone(true);
                });
            }
        });
    </script>

控制器

[HttpPost]
    // Receive parameters what you are passing
    public ActionResult MemberInformation_Detail(string name, string FName)
    {
        // return proper json object that contains all properties that you are using in js
        return Json(new { MemberShipID = 123, name = "Test", FName = "Fathename", Gender = "Male", address = "N/A", phone1 = "123456789", mobileno = "123456789", email = "abc@abc.com", ClientPic = "clientpic" });
    }

【讨论】:

  • ok 只需在 ajax 请求中使用 data:JSON.parse(Mname) 而不更改 Mname
  • 兄弟,从控制器传递来查看我的问题的数据不是问题,是如何在文本框中显示 Mname 数据。
  • 如果你有 Skype id 请发给我,我可以解释得更好。
  • 您正在使用 onsuccess 方法中的响应来填充文本框中的数据,您可以替换 var customers = Mname;
  • Hafiz Asad,我已经粘贴了控制器,请检查。
猜你喜欢
  • 2014-07-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多