ASP.NET MVC Jquery plugin called from Layout and View both - asp.net-mvc

We have a custom jQuery plugin that is called in the _Layout.cshtml page of our ASP.NET MVC project.
$(document).ready(function() {
plugin1.func1(true); //true is a param
});
This has been working well, but now in a view - View1.cshtml, I need to call the same plug in as:
$(document).ready(function() {
plugin1.func1(false); //false is a param
});
What is a recommended way to unload/override the plug-in in Layout when user is on View1?
Thanks

Related

How to communicate between mvc partial view and angular component

How can i call a method inside the angular component when i change the drop down in the partial view.
I have a Partial view with a drop down control and an angular component in my mvc page. When i change my drop down in the partial view(created using razor engine), i need to trigger a method inside the angular component.
I found a workaround.
Add a input on the angular component html
<input type="hidden" id="selDate"/>
attach an onChange event in the corresponding .ts file
$(function () {
$('#selDate').on('change', function () {
var dt = $('#selDate').val();
self.getIRData(dt);
});
});
set the value of the above control from the partial view(dropdown change event) and simulate an onChange event by adding Dispatchevent()
please let me know if you have any better workarounds

asp.net filter equivalent in angularjs

I would like to invoke a service method on the beginning of each controller in angularjs. Just like I would do with a filter in asp.net mvc or a middleware in express/nodejs.
How should I do this in angularjs ?
I found out how to go about doing this.
AngularJS provides events I can bind to.
$onRouteChangeStart and $onRouteChangeFinish
The first is triggered just before the route is changed, and the latter after (and after all dependencies are resolved for the controller).
So, in order to invoke code before each controller I would add something like this to my app:
var app = angular.module('MyApp', [...]);
app.run(['$rootScope', function($rootScope) {
$rootScope.$on('$routeChangeStart', function(event, target) {
// CODE GOES HERE
});
}]);

Prevent page to navigate via MVC Ajax actionlink

I am using asp.net (model view controller) razor view Ajax action link to navigate through pages in my website. My requirement is i will have to restrict the user and populates some popups before navigating to different page and leaving to the current page.
suppose there is view 1 (link) i am clicking on view 1 before loading view 1 page, i will have to show some popups..
I have implemented this functionality with html action link but i want it for ajax Action link too.
Thank you,
You can implement OnSuccess (or OnFailure or OnBegin or OnComplete) events in JavaScipt for Ajax.ActionLink() check below code -
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script type="text/javascript">
function Test() {
alert('hi');
}
</script>
#Ajax.ActionLink("Rules", "LoadRules", new AjaxOptions { OnSuccess = "Test" })
Above code invokes Test JavaScript function, in there I am just alerting a message. But in your requirement, you can use some JQuery Modalpopups (or even a window.open()) to display popups for end user.

Is there a clean way to embed a url in a razor view?

I have a partial view in an ASP.NET MVC app:
#Html.Partial("_Comments", Model)
I want to make this partial a "plugin" that can be called from other apps. So, I created a separate action in my controller to return this partial view alone:
public ActionResult Embed()
{
return View("_Comments", new CommentsModel());
}
This action can then be accessed via the URL [root]/Comments/Embed and returns the partial view's HTML.
Is there a clean way to embed the response from this URL in a separate MVC razor view (in an entirely different app)?
Thanks!
Is there a clean way to embed the response from this URL in a separate MVC razor view (in an entirely different app)?
This means client side code, for example:
function getComments() {
$.ajax({ url: '[root]/Comments/Embed',
iframe: true,
success: function (data) {
$("#target-id").html(data);
}
});
}
Edit
In case you use this ajax plugin, if you set
iframe: true
then you access cross domain by iframe transparenlty
I found a solution.
#Html.Raw(new WebClient().DownloadString("[root]/Comments/Embed"))

autopostback for dropdownlist in mvc.net

how to set autopostback for dropdownlist in mvc.net?
You don't - there's no concept of 'autopostback', in the same way that there is no postback concept in the MVC framework.
If you want to submit the form, you can do that via javascript, if you want to update something else via a call to the server, you can set up an AJAX call, probably using jQuery to do so.
There's a bit of an example here.
no jquery required. wrap each hidden id and dropdown in a form with the action to updateproduct. then its just:
#Html.DropDownList("id", (SelectList)ViewBag.Values, new { onchange = "this.form.submit();" })
autopostback supports only in asp.net not in mvc.net, so you just need to write #Html.DropDownList("id", (SelectList)ViewBag.Values, new { onchange = "this.form.submit();" }) or jquery function in the cshtml file script section.
One thumb rule for MVC,
Any method of controller, on
be called by JS or Jquery thru Ajax calling routing.

Resources