Hide the Partial view and show another partial view in mvc3 - asp.net-mvc-3

I have a hyperlink column in the grid. On clicking the link i have to hide the partialview(grid section) and have to show/load another partialview which is the detail section. Please provide solution

You could use javascript. With jQuery that will correspond to the .toggle() function or the .show()/.hide() functions. So basically you will subscribe to the click event of the link and inside this handler show and hide the respective sections. For this to work you should obviously place those partials inside placeholder divs so that you could show/hide the entire placeholder.
If in addition to showing the partial you need to fetch some fresh information from the server then you could use AJAX to request a controller action that will return the fresh data of the partial view that you will inject into the DOM at the correct placeholder location. In order to send an AJAX request in jQuery you could use the $.ajax() function or directly the .load() function.

Related

How to load different views in one div that situated in home page on button click using ajax,jquery,codeigniter

I have a page like home now what I want is if I click a button or link like a menu a corresponding view must load in that div in the home page. On every button click the views are must change inside the div without refreshing the entire page.
I know this can be done with ajax and jquery.
on click event of button call a javascript method, collect information which affect different views, send ajax request in a controller with post data, according to data, load a view like
$res = $this->load->view('myview1')
Remember, ajax request should not be of "json" type.
Ajax request will send a string, take this string in a javascript var.
now in javascript
$('#div_id').html(res);

How to filter page content according to dropdown box selection in cakephp 2.x

I have a select box in my view.ctp , it shows some content from the controller, but my problem is i want to load content dynamically according to the droapdown selection
i tried with making ajax request on onchange of selection in the select box. but the problem is ,the select box id is sending to the controller function, their i set the content for display .but the page is not refreshing..
I dont know which logic sholud use for this purpose..if anybody have an exerience with this..please replay me..
In order to achieve those results you should follow the next steps:
Create an action that returns the content with $this->layout = null
Create a view for this action that displays the content in the way you desire (html with no css)
In the view that you like to fetch that content through AJAX make a request that pulls that controller and view
append it where you want it on your page (with proper css on the page you make the request it will display correctly)

Create a Web Grid using Javascript

Can we create a WEB GRID dynamically using JAVASCRIPT ?
I am using MVC 3 and Razor as my view.
On one of my Razor view I have a drop down box what I want is to create a web grid dynamically on selection of a drop down I get the data depending on the value selected from the drop down box.
Please help me on this.
I had to use ajax for this, where I had called a method using ajax and my method (present in the controller) returned a partial view.
My partial view had the grid I needed to show. and in the method (present in the controller) I had passed value from the dropdown box using ajax, and using this value I had queried my database and sent that model to the partial view.

How can I use inbuilt validation of MVC3 in partial views containing Ajax.beginForm

I have four partial views on my page. And on each partial view I am using AJAX.BeginForm. In each partial view I have one submit button and on click of that button I want to validate the controls of that partial view only. I have included inbuilt js files jquery.validate.unobtrusive.js and jquery.validate.min.js in my master page i.e. layout.cshtml
But if I use AJAX.BeginForm in my partial view then it does not validate the controls because those js files are not included in this ajax form.
One way is that I include all those js files in each Partial view but I do not want to take this approach because it is making my page very heavy.
Is their any other way that I can validate my controls without including all js files in all partial views.
Thanks in advance.
Re-attach the validators after the partial view is loaded. Like this:
$(function (){
$('yourSelector').removeData("validator");
$('yourSelector').removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse('yourSelector');
});
yourSelector can be the form.

Can we create a ajax form within a fieldset of another form?

Is this possible?
The ajax form's purpose is to serve as a selector for the main form.
Forms cannot be nested.
Btw, you don't need a form for that purpose. Just send AJAX request without any form.
Put a select/set of radio buttons outside the form, assign onchange handler and in it do whatever you want. For example - send AJAX query and modify the form.

Resources