4

アクションの結果があり、ajax を使用してビューの div タグに表示したいのですが、これが私のアクションの結果です。

public ActionResult Details(string id)
    {
        var subscriber = new SubscribersModel();
        IEnumerable<Subscribe> list = from s in dbcontext.Subscribes select s;
        foreach (var sb in list)
        {
            if (sb.cin == id)
            {
                subscriber.cin = sb.cin;
                subscriber.name = sb.name;
            }
        }
        return PartialView("Details",subscriber);
    }

これは私の Detailsviewです:

 @model _3SDWebProject.Models.SubscribersModel

 <fieldset>
<legend>SubscribersModel</legend>

<div class="display-label">
     @Html.DisplayNameFor(model => model.name)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.name)
</div>

<div class="display-label">
     @Html.DisplayNameFor(model => model.cin)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.cin)
</div>
</legend>

これは、アクションの結果を表示したいインデックスビューです:

  @model IEnumerable<_3SDWebProject.Models.SubscribersModel>
 @{
   ViewBag.Title = "Subscribers";
  }

<script>
  function details(id) {
    var url = '/Subscribers/Details/' + id; 
    $.ajax({
        url: url,
        type: 'GET',
        data: id,
        success: function () {
            $(".sidebar").html();
        }
    });
}

$(function () {
    $(".details-logo").on('click', function () {
        details($(this).attr("DtNo"));
        alert("ok");
    });

});
  </script>
  <div class="sidebar">
       //Here i want to show my result !!!!!!!
   </div>

<div class="content" style="width: 700px; margin-left: 250px; height: 545px;margin-top:  -30px;">
<h2>Subscribers</h2>
 table class="altrowstable" id="alternatecolor">
<tr>
    <th>
        CIN
    </th>
    <th>
        Name
    </th>
    <th>
</tr>
 @foreach (var item in Model) {
 <tr id="row-@item.cin">
    <td>
        @Html.DisplayFor(modelItem => item.cin)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.name)
    </td>
 </tr>
  //this is my actionLink
  @Html.ActionLink("Details", "Details", new { id = item.cin }, new { @class = "details-logo",@DtNo=item.cin})
 }

誰かが何か考えを持っているなら、私は非常に感謝します。注意：詳細アクションリンクを押すと、本当の情報が表示されますが、サイドバーではなく、次のような別のビューに表示されます:

ここに画像の説明を入力

4

2 に答える 2

2

ajax関数を次のように変更するだけです

$.ajax({
        url: url,
        type: 'GET',
        data: id,
        success: function (result) {
            $(".sidebar").html(result);
        }
    });

これにより、購読者の詳細ページが取得され、に追加されます.sidebar

編集：

onclick イベント ハンドラを変更して、ハイパーリンクのデフォルト アクションを停止します。return false を追加するだけで、ハイパーリンクが新しいページに移動しないようにできます。下記参照。

$(function () {
    $(".details-logo").on('click', function () {
        details($(this).attr("DtNo"));
        alert("ok");
        return false;
    });

});
于 2013-04-30T12:26:00.843 に答える
1

ajax関数を次のように変更します

function details(id) {
    var url = '@Url.Action("Details", "Subscribers")'; 
    var params = {
      id:id
    }
    $.ajax({
        url: url,
        type: 'GET',
        data: JSON.stringify(params ),
        success: function (result) {
            $(".sidebar").html(result);
        }
    });
}
于 2013-04-30T12:32:45.947 に答える