呈现MVC3使用JQuery管窥JQuery

2023-09-11 22:28:54 作者:怪我过分顽皮只想离开你

我有一些记录。当每个记录有信息需要手风琴显示点击。

这信息应该从数据库中动态获取。

是我到目前为止,完成的是

创建的局部视图。这是假设,以显示详细的信息。

一旦点击记录,我叫jQuery的方法和控制器执行我的方法。控制器返回对象以JSON的形式(或任何其他东西,开的任何建议)。

  

现在JQuery的方法是(型号)的对象,但我怎么能使用它来   渲染从中我的部分观点。

解决方案   

我有一些记录。当每个记录点击有信息   需要在手风琴来显示。

MVC3学习之网站创建与发布

有你可以实现你的愿望两种方式。我猜你必须从提供有关记录的详细信息的操作返回一个局部视图。

听着锚链接的点击事件和里面你必须帧的网址和事件再 $(#手风琴容器-1)。载荷(URL)

例。

从您的评论我看你有没有通过 orderNo 的动作作为参数。所以,你必须设置 orderNo 作为ID或追加的一些字符串(以避免在元素重复的ID),并设置为id为锚链接。

然后,

  $(函数(){

  $(a.somecssclass)。点击(函数(){

     VAR orderNo = this.id;

     VAR URL =/ ControllerName /跟踪orderNo =?+ orderNo;

     //这将调用通过AJAX的动作和更新容器的
     //局部视图的HTML。
     $(#divToLoadTheHtml)负荷(URL)。
  });
});
 

在利用MVC支持AJAX操作链接。您可以通过创建一个动作链接 Ajax.ActionLink 调用通过AJAX一些控制器操作和更新HTML结果到容器中。

例。

在当你通过循环收集产生的记录,你必须创建链接(点击已加载通过AJAX的内容)通过 Ajax.ActionLink 这种情况下,方法,你也必须包括 jquery'unobtrusive.ajax.js 库。

  @foreach(VAR米系列)
{
    .. 其他的东西

    @ Ajax.ActionLink(链接的名字,动作,新{orderNo = m.something?},
    新AjaxOptions
    {
        UpdateTargetId =somediv//要加载的局部视图设置分区名称
    });
}
 

基于OP的评论更新

您的操作方法应该是这样的,

 公共PartialViewResult跟踪(INT orderNo)
{
     VAR经理=新的OrderManager();
     返回PartialView(manager.Tracking(orderNo));
}
 

您应该有一个局部视图或者名为 Tracking.cshtml 和局部视图里面你必须创建重新presents的详细信息的HTML你在谈论的记录。

Tracking.cshtml

  @model TrackingModel

< D​​IV>
  @ Html.DisplayFor(...)
  ...
< / DIV>
 

在调用操作跟踪从jQuery的或通过AJAX的动作(如我所描述previously),你会得到部分查看HTML,你可以加载到一个特定的容器上,如DIV。

I have some records. Upon clicking on every record there information needs to display in an accordion.

That information is supposed to fetch from database dynamically.

What i've done so far is

Create a partial view. That is suppose to display the detailed information.

Upon click on record, i call jquery method and execute my method on controller. Controller returns object in the form of Json(or any other thing, open for any suggestions).

Now JQuery method has that (Model)object, but how could i use it to render my partial view from it.

解决方案

I have some records. Upon clicking on every record there information needs to display in an accordion.

There are two ways you can achieve what you desire. I guess you have to return a partial view from the action that gives a detailed information about the record.

Listening to the click event of the anchor links and inside the event you have to frame the url and then $("#accordion-container-1").load(url).

Ex.

From your comment I see you have to pass the orderNo the action as parameter. So you have to set the orderNo as id or append that to some string (to avoid duplicate ids in elements) and set to the id for the anchor link.

Then,

$(function(){

  $("a.somecssclass").click(function(){

     var orderNo = this.id;

     var url = "/ControllerName/Tracking?orderNo=" + orderNo;

     // this will call the action through ajax and update the container with the
     // partial view's html.
     $("#divToLoadTheHtml").load(url); 
  });   
});

Using ajax action links supported by MVC. You can create an action link using Ajax.ActionLink that call some controller action through ajax and update the html result to a container.

Ex.

In this case when you are generating the records through looping the collection you have to create the links (on click has to load the content through ajax) through Ajax.ActionLink method and also you have to include the jquery'unobtrusive.ajax.js library.

@foreach(var m in Collection)
{
    .. other stuff

    @Ajax.ActionLink(link name, "Action", new { orderNo = m.something? }, 
    new AjaxOptions
    { 
        UpdateTargetId = "somediv" // set the div name where you want to load the partial view
    });
}

Update based on OP's comment

Your action method should be something like this,

public PartialViewResult Tracking(int orderNo) 
{ 
     var manager = new OrderManager(); 
     return PartialView(manager.Tracking(orderNo));
}

You should have a partial view either with the name Tracking.cshtml and inside the partial view you have to create the html the represents the detailed information of the record that you were talking about.

Tracking.cshtml

@model TrackingModel

<div>
  @Html.DisplayFor(...)
  ...
</div>

When you call the action Tracking from jquery or through ajax action (as i described previously) you will get partial view html that you can load into a particular container like div.