Develop Reference

How to load Razor partial view in jQuery without using MVC?

I am working on a Umbraco 7 project started without MVC implemented. I try to implement a loading without page refresh. I am stuck now because I need some Razor code to get Umbraco information but I need jQuery to refresh without page refresh.
Here my code:
$(function () {
$.ajaxSetup({
cache: false
});
$('#filterButton').click(function(){
$('#content').html(#Html.Partial("~/Views/Partials/Preferences.cshtml"));
})
});
I tried with .load()with .html using #Html.Action,#Html.Partial etc, but nothing works. I know it is really simple to link a controller to an action like this but it will take me to much time now to change everything.
Can you say me if it is possible or not?

Please jquery try
$('#content').load("/Partials/Preferences");
another html helpers try
#{
Html.RenderAction("Preferences","Partials");
}
Syntext For
#Html.RenderAction(Action, Controller, Route)

Avoiding .NET MVC controller calls with angular-ui-router

I am building a .NET MVC 5 application on back-end and Angularjs on front-end.
I am loading .cshtml views in a div containerOne on a parent .cshtml page with ui.router and everything is working fine. An issue I would like to solve is when I enter manually a page URL that is C# controller's action path(in the example I provided below it is /Proposal/Customers) - my view is loaded on a whole page. What I want to be called is a .state named 'customers' in my example, or something like that. My example code is(part of my proposalConfig.js):
.state('customers', {   
url: 'AllCustomers',
views: {
containerOne": {
templateUrl: '/Proposal/Customers'
}
}
});
On my back-end I have a ProposalController.cs and an action method Customers that calls a Customers.cshtml view.
Anyone has an idea how to solve this?
EDIT
The same thing happens if, instead of 'AllCustomers' I put '/Proposal/Customers', and then after the first load of a .state I refresh a page.
I forgot to mention that I have $locationProvider.hashPrefix('!').html5Mode(true); in a proposalConfig.js file.

If you mean that the entire page html markup (html tag, body tag and such)is being returned when you only want the specific content of the Customer.cshtml, which I also assume only has what you want in it, its probably because your view has a shared view start layout. Put this in Customer.cshtml
#{
Layout = null ;
}

Update Dropdown List from Code Behind Using Javascript / JQuery

I have an application with two sections.
The top section has a dropdownlist that displays all the members in the database using a code behind method on called on page load.
The bottom section has a grid where you can add / delete / edit members using JQuery.
A change in this section obviously does not rebuild the dropdownlist in the top section.
I want to run some code in the JQuery success method that updates/rebuilds the dropdownlist to reflect the newest change to a member. I would like if possible to use the same code behind method that hits the db on page_load to populate the dropdown.
Is this possible? If so, how would I go about accomplishing this?
Any help would be greatly appreciated.
[Requested Code]
.aspx file
<asp:DropDownList ID="director" runat="server"></asp:DropDownList>
jQuery success() fired on add/delete/update member grid.
.aspx.cs (code behind)
private void LoadDirectorOptions(int deptId)
{
var memberRepo = new MemberRepository();
List<Member> members = memberRepo.GetMembers(deptId);
director.DataSource = members;
director.DataTextField = "FullName";
director.DataValueField = "Id";
director.DataBind();
director.Items.Insert(0, new ListItem("<Please Select>", "0"));
}

You can not use the same code behind method since it is a server side code and the JQuery code happens on the client side unless you refresh the page after the JQuery code executed. You can grape all the members on the same web service you are providing for updating the grid.
down list. for example :
$.ajax({
// Updating the grid here and retrun all the members : it will be saved in the response
type: "Get",
url: url,
data: data,
dataType: dataType,
success: success(data)
});
function success(data)
{
//here you can get the resposne from the server
// Iterate through data and add option elements
$(".members").append("<option value=? text=?/>");
}
Most probably your data must be JSON that has all the members in your server members database table. then you can add a CSS class(members) to your drop down list and use JQuery selector to select the drop down list.
Hope this is helpful.

Should use ajax in your success call to call method. http://api.jquery.com/jQuery.ajax/

If you want to refresh the dropdown without refreshing the whole page, you need to wrap them inside an UpdatePanel. When the grid in the bottom section is changed, update the UpdatePanel so that it rebinds the dropdown. To force the UpdatePanel to update in Javascript you could use the GetPostBackEventReference method to force a postback like this:
<%= Page.ClientScript.GetPostBackEventReference(updatePanelID, "")%>

How to update part of a cshtml shared layout on intervals?

I want to modify the content of a div in my shared layout when there is an update at my database. Whats the best way to go about it ? Timers to check database + somehow update view from controller ? In view c# functions ? ajax ?(don't know much about it) or some other way ? Thanks in advance.

Use setTimeout utility of javascript to get timer behavior.
Create a Controller Action and its associated partial view which will have the content you need to load dynamically. You can return a formatted Html from the view or a structured Json object from the controller action whichever is suitable for you..
considering that your following is your DIV tag.
<div id="dynamicContent"></div>
use
$(function(){
var function updatecontent()
{
$("#dynamicContent").load(URL)
setTimeout(updatecontent,5000);
}
setTimeout(updatecontent,5000);
});
to load content dynamically, url would be
YourDomain.com/Controller/Action
$.load()
will load the content of partial view using Ajax, and you will get a nice behavior on page.

Updating partial view with Jquery in ASP.NET MVC C#

I am using MVC C# along with Jquery.
I have a partial view in a rather large page that has a number of tabs.
On a click of a checkbox, I like to update the partial view WITHIN the form.
What I am getting instead is just the partial view
Here is my code in Jquery:
$('#activelist,#inactivelist').change(function () {
var status = 'inactive';
window.location.href = '#Url.Action("Skits","KitSection")' + '?id=' + id+ '&status=' + status;
});
Any idea on how I could update the partial view within a form in terms of how I would make a call to it?
Here is the code for the PartialView
return PartialView(Kits);
As mentioned, what I see is just the partial view displayed and not the whole form.

window.location.href will reload the entire page. You need to reload some part of your page without a complete reload. We can use jQuery ajax to do this. Let's Find out what jQuery selector you can use to get the Partialview.
For example , Assume your HTML markup is like this in the main form ( view)
<div>
<p>Some content</p>
<div id="myPartialViewContainer">
#Html.Partial("_FeaturedProduct")
</div>
<div>Some other content</div>
</div>
And here the DIV with ID myPartialViewContainer is the Container div which holds the content of the partial view.So we will simply reload the content of that div using jQuery load method
$(function(){
$('#activelist,#inactivelist').change(function () {
var id="someval";
var status = 'inactive';
$("#myPartialViewContainer").load('#Url.Action("Skits","KitSection")' + '?id=' + id+ '&status=' + status)
});
});

You are redirecting the user, via the window.location.href property, to the URL of your partial, hence only displaying that partial.
You should instead do an AJAX call to the partial to retrieve it's HTML and then use something like the .append method to add it to whatever container element you want it to be added to.
EDIT: The .load() jQuery ajax method is actually better for this specific situation.