Partial View - Page Reload
I have implemented a combo live search box. when user selects a particular search result, search result info is passed back to my action, but once I am trying to reload the page after user selects it and display new information, the page doesnt reload and new info is not displayed
Here is what I want to do:
after user selects an option, send some information back to action(which I did) and reload the page displaying extra content to the side of the search box. Even if this needs to loose the search box selected item, i am fine with it.
but page reload and some extra content have to be main req.
Please let me know how to implement this. below is what I tried.
Code:
//Combo live search code would be same as in Ext.net Example.
//then I created a direct listener for the item user selects a particular item
.DirectEvents(de =>
{
de.ItemClick.Url = Url.Action("Selected_pat");
de.ItemClick.EventMask.ShowMask = true;
de.ItemClick.ExtraParams.Add(new Parameter() { Name = "ICode", Value = "#{cbxLiveSearch}.getValue()", Mode = ParameterMode.Raw });
})
this is passed to action in controller, which I followed with MVC declarations like below
Code:
public ActionResult Selected_pat(int ICode)
{
Pat p = new Pat();
p.i = 0;
return PartialView("Selected_pat",p);
}
//Selected_pat is my view name and p is sent to model to access its information
//Here is my view that I want to display the model information.
Code:
@if (Model.i == 0) // i will set the i value in action, so that this wont be rendered first time
{
@Model.sLastName
@Model.sFirstName
}
However I was able to get the information I passed to view via model, but for some reason due to scripts running background wouldnt allow the page to reload and eventually model parameters are not being set .
Any help is very much appreciated.
Thanks,
Vakshu.
Updated Code:
View page : combo search
Code:
// I have a update target id which I would like to update just like in MVC.
.DirectEvents(de =>
{
de.ItemClick.Url = Url.Action("Selected_Pat");
de.ItemClick.EventMask.ShowMask = true;
de.ItemClick.ExtraParams.Add(new Parameter() { Name = "ICode", Value = "#{cbxLiveSearch}.getValue()", Mode = ParameterMode.Raw });
de.ItemClick.ExtraParams.Add(new System.Web.Mvc.Ajax.AjaxOptions() { UpdateTargetId = "Selected_pat" });
Controller action:
Code:
Public ActionResult Selected_Pat(int ICode)
{
pat p = new pat();
p.i= 0;
return PartialView(Selected_Pat, p);
}
trying to access then the id with contained in view page again, which has to be from partial view page.
Code:
@if(Model.i == 0)
{
@(Html.X().Container().StyleSpec("border:solid 1px black; height:150px; width:300px;")
.ID("Selected_pat")
.Loader(X.ComponentLoader()
.Url("/Pat/Selected_Pat")
))
} // I am not using this component. Instead I am using the div tag and renderpartial
// tried this code for rendering partial view like in MVC. id is declared on the top and the render partial is shown
below which will be enclosed with <div id = "Selected_pat"></div> tags
@html.renderPartial("Selected_pat", Model)); --> it gives error:
cannot be converted of type 'void' to 'object'.
I am not merging mvc code with any code of Ext.net. It seems there is a problem just to use the MVC code alone along with Ext.net. Can I know the reason for this or am I declaring the wrong way ?
Still I dint get it to be working..If anyone has worked on same situation please reply.
content from partial - made the difference
Here is the other way I tried. I'm posting the solution, hope it can help some one who are trying my way !
Code:
<div id="Selected_Pat">
@(Html.X().Container().StyleSpec("border:solid 1px black; height:150px; width:300px;")
.ID("Selected_Pat")
.ContentFromPartial("Selected_Pat", Model)
)
</div>
My action:
Code:
public Ext.Net.MVC.PartialViewResult Selected_Pat(int ICode, string containerId)
{
Pat p = new Pat();
p.i = 0;
return new Ext.Net.MVC.PartialViewResult
{
RenderMode = RenderMode.AddTo,
ContainerId = containerId,
WrapByScriptTag = false,
Model = p,
//ViewName = "Selected_Pat" --> this should be removed. This is a duplicate Id.
};
}
editable form panel partial view
Hello,
As showed in above code I was able to generate the partial view. But I would like to have a partial view of editable form panel.
This is what I'm trying to achieve,
Partial view of form panel, which can be double click editable(or edit button making text fields editable) and changes have to be saved by clicking save button. Clicking on save/ edit button should not reload the page. just the changed info has to be passed asynchronously.
I tried below code and following links
http://mvc.ext.net/#/Form_Groups/GroupFor/
http://mvc.ext.net/#/Form_Groups/Basic/
http://mvc.ext.net/#/Editor_Basic/FormPanel_Labels/
Code:
public Ext.Net.MVC.PartialViewResult Selected_Pat()
{
Pat p = new Pat();
p.i = 0;
return new Ext.Net.MVC.PartialViewResult
{
RenderMode = RenderMode.AddTo,
ContainerId = containerId,
WrapByScriptTag = false,
Model = p,
return this.FormPanel()
or
return new object[]
// if I use like this, I have an error "cannot implicitly convert type object[] to Ext.Net.MVC.PartialViewResult.
};
Please let me know if someone already have tried this and if possibly simple example, it would be great.
Thanks,
Vakshu.