在Ajax中再次单击该按钮时显示无

时间:2015-09-18 03:22:02

标签: ajax asp.net-mvc

我一直在使用Ajax在我的应用程序中显示部分页面。 我想问一下,当用户再次点击@Ajax.ActionLink()生成的链接时,是否可以将显示设置为无?

这是我的代码:

@model IEnumerable<RMSystem.Models.rms_referred_vw>

<table id="example">
  <tbody>
    @foreach(var rfp in Model){
      <tr>
        <td>
        @Ajax.ActionLink(Convert.ToString(rfp.rf_id), "Edit_Ref", new { rf_id = rfp.rf_id },
          new AjaxOptions
          {
            HttpMethod = "POST",
            InsertionMode = InsertionMode.InsertBefore,
            UpdateTargetId = "target6",
          }, new  {@style="color:darkblue", title = "Edit Referred Person"})
        </td>
        <td>@Html.DisplayFor(model => rfp.rf_badgeno)</td>
        // more table cells
         <td>
            @Ajax.ActionLink("Details", "Details", new { rf_id = rfp.rf_id },
              new AjaxOptions
              {
                HttpMethod = "GET",
                InsertionMode = InsertionMode.Replace,
                UpdateTargetId = "show",
              }, new  {@style="color:darkblue", title = "Show More Details"})
         </td>
    </tr>
    }
  </tbody>
</table>

<div id="target6"></div>
<div id="show" style="width:250px;height:200px;margin-left:1000px;"></div>

这是我的代码先生。

控制器:

public ActionResult Details(int rf_id = 0)
{
    var check = db.rms_approval_route_vw.Where(s => s.rf_id == rf_id).FirstOrDefault();
    try
    {
        if (check != null)
        {
            return PartialView(check);
        }
    }
    catch (Exception) {
        throw;
    }
    return Content("<script type='text/javascript'>alert('Waiting for regularization.');</script>");
}

1 个答案:

答案 0 :(得分:1)

删除@Html.ActionLink()并替换为(请注意以下代码是第二个链接)

<td><a href="#" class="details" data-id="@rfp.rf_id">Details</a><td>

并添加脚本

var details = $('#show');
$('.details').click(function() {
  var self = $(this);
  // Check if we have already loaded it
  if (self.data('loaded'))
  {
    details.empty(); // clear contents
    self.removeData('loaded'); // signal is no longer loaded
  } else {
    $.get('@Url.Action("Details")', { rf_id: $(this).data('id') }, function(data) {
      details.html(data); // update the DOM
      self.data('loaded', true); // signal its been loaded
    });
  }
});