I have an ASP.NET MVC app that opens a "Request" view in a new browser window. When the user submits the form, I'd like the window to close. What should my RequestController code look like to close the window after saving the request information? I'm not sure what the controller action should be returning.
You could return a View that has the following javascript (or you could return a JavaScript result) but I prefer the former.
public ActionResult SubmitForm()
{
return View("Close");
}
View for Close:
<body>
<script type="text/javascript">
window.close();
</script>
</body>
Here is a way to do it directly in your Controller but I advise against it
public ActionResult SubmitForm()
{
return JavaScript("window.close();");
}
Like such:
[HttpPost]
public ActionResult MyController(Model model)
{
//do stuff
ViewBag.Processed = true;
return View();
}
The view:
<%if(null!=ViewBag.Processed && (bool)ViewBag.Processed == true){%>
<script>
window.close();
</script>
<%}%>
It sounds like you could return an almost empty View template that simply had some javascript in the header that just ran "window.close()".
You can close by this code:
return Content(#"<script>window.close();</script>", "text/html");
This worked for me:
[HttpGet]
public ActionResult Done()
{
return Content(#"<body>
<script type='text/javascript'>
window.close();
</script>
</body> ");
}
This worked for me to close the window.
Controller:
return PartialView("_LoginSuccessPartial");
View:
<script>
var loginwindow = $("#loginWindow").data("kendoWindow");
loginwindow.close();
</script>
Using this you can close the window like this:
return Content("<script language='javascript'>window.close();</script>");
Related
Im writing a script, i want to display a message to the view and then start my action. But its not showing anything, because my executing is blocking my startmessage. I dont want to use jquery/javascript.
Im trying this in my home/index controller
return View(model: "Synck started, " + DateTime.Now.ToString("yyyy-MM-dd
HH:mm:ss"));
In my view
<div id="txt">
#Model // Synck started, 2015-10-10 10:10:10
#Html.Action("Start", "Home")
</div>
This worked for me...
The Controller::
// GET: Home/Index
public ActionResult Index()
{
ViewBag.Message = "Synck started, " + DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
return View();
}
The View:
#ViewBag.Message
Ideally what you should be doing is keeping your long running code to a separate method and asynchronously invoke it from your UI. You may use jQuery ajax to do this.
public ActionResult Index()
{
return View();
}
public ActionResult SyncMydata()
{
//Execute your long running code here and return something as needed.
}
And in your Index view,
<div id="status"></div>
<script type="text/javascript">
$(function(){
var url="#Url.Action("SyncMydata","Home")";
$("#status").html("Started syncing at "+new Date().toLocaleString());
$.post(url,function(res){
$("#status").html("Sync completed"));
});
});
</script>
If you want, you can get the start time from the Index action(server side) rather than using the javascript time.
You can try to send the message that you want to display and ready for ViewData
Your Controller :
controllerName ()
{
ViewData["Message"] ="Synck started, " + DateTime.Now.ToString("yyyy-MM-dd
HH:mm:ss";
return View();
}
Your View:
<div id="txt">
#ViewData["Message"] // Synck started, 2015-10-10 10:10:10
#Html.Action("Start", "Home")
</div>
I'm trying to create an autocomplete text box using Jquery UI.
I can see that GetActiveItems works fine and i got a json result , but I can't see the autocomplete on the screen. I think that the problam is in the 'OnActionExecuted' when the ActionResult is being execute.
Please help me :)
thanks,
Siri
View:
<input type="text" id="mpvalue" name="mpvalue" />
<script type="text/javascript">
$(document).ready(function () {
$('#mpvalue').autocomplete({
source: '#Url.Action("GetActiveItems")'
});
})
</script>
Controller:
public ActionResult GetActiveItems(string term)
{
var result = from e in db.Items
where (e.IsBlock != true) && (e.Description.ToLower().Contains(term))
select e.Description;
return Json(result, JsonRequestBehavior.AllowGet);
}
Ok so I am fairly new at AngularJS and just running through a demo, but I am having issues with the routing side of things and can't figure it out. I thought you guys would know instantly that I have done something dumb.
So here goes.
This is my JS file
var WebApplication2 = angular.module('WebApplication2', ['ng-route']);
WebApplication2.controller('LandingPageController', LandingPageController);
WebApplication2.config([
'$routeProvider',
function ($routeProvider) {
$routeProvider
.when('/routeOne', {
templateUrl: 'routesDemo/one'
})
.when('/routeTwo', {
templateUrl: 'routesDemo/two'
})
.when('/routeThree', {
templateUrl: 'routesDemo/three'
});
}
]);
And here is my html code
<html ng-app="WebApplication2" ng-controller="LandingPageController">
<head>
<title ng-bind="models.helloAngular"></title>
</head>
<body>
<h1>{{models.helloAngular}}</h1>
<ul>
<li>Route One</li>
<li>Route Two</li>
<li>Route Three</li>
</ul>
<div ng-view></div>
<script src="~/Scripts/angular.min.js"></script>
<script src="~/Scripts/angular-route.min.js"></script>
#Scripts.Render("~/bundles/AngularBundle")
</body>
</html>
I also have this js controller file
var LandingPageController = function ($scope) {
$scope.models = {
helloAngular: 'I work!'
};
}
I then have a controller with the following actionresults
public class RoutesDemoController : Controller
{
public ActionResult One()
{
return View();
}
public ActionResult Two()
{
return View();
}
public ActionResult Three()
{
return View();
}
}
This is a dependency injection error.
Try this :
var WebApplication2 = angular.module('WebApplication2', ['ngRoute']);
instead of :
var WebApplication2 = angular.module('WebApplication2', ['ng-route']);
Since you are using routing, you should not declare an ng-controller attribute on your view. With routing, each of your views can use a different controller.
Instead of the HTML tag you mentioned above, it should be like this:
<html ng-app="WebApplication2">
You should declare the controller you wish to use in your route. The templateUrl is the path to the HTML file you will use as the template:
$routeProvider.when('/routeOne', {
templateUrl: 'views/route-one.html',
controller: 'LandingPageController'
})
Your controller's code should look something like this:
WebApplication2.controller('LandingPageController', function ($scope) {
$scope.models = {
helloAngular: 'I work!'
};
});
Where you are using <h1>{{models.helloAngular}}</h1> that is not in the scope of your route. The views for your routes will render in <div ng-view></div>.
In your views/route-one.html file you can add <h1>{{models.helloAngular}}</h1>.
You can view this page in the docs for an example implementation of ngRoute.
Angular is used to build single-page applications—your ASP.net's router will have nothing to do with Angular's routes. You just need to declare a single static route that is pointed to your Angular application. Server-side and client-side routing will not work hand-in-hand.
Have a basic question regarding partial view.the #ViewBag.Message comes out empty in the final render.
My controller looks like this
public ActionResult Message() {
ViewBag.Message = "This is a partial view.";
return PartialView();
}
public ActionResult PartialViewDemo() {
return View();
}
My partial view looks like this in Message.cshtml
<h2>#ViewBag.Message</h2>
I am calling the partial view like this from partialViewTest.cshtml. the #ViewBag.Message is empty and only h2 tag is shown.
<div>#Html.Partial("~/Views/Sample/Message.cshtml")</div>
If i implement using javascript it works fine
<div id="result"></div>
#section scripts {
<script type="text/javascript">
$(function () {
$('#result').load('/sample/message');
});
</script>
}
You Render Message.cshtml only (not controller) from partialViewTest.cshtml. As you set ViewBag.Message in the controller, you have to call the controller (to get partial view) like this.
#Html.Action("Message", "Sample")
I've simplified the below for brevity.
When I click the actionlink, the action works successfully but returns only the partial view on it's own page rather than rendering it within the view. Any suggestions where I am going wrong?
PartialView ActionLink
#Html.ActionLink("Click", "_Partial1")
Controller
public ActionResult Index()
{
return View()
}
public ActionResult _Partial1()
{
...do stuff
return PartialView();
}
You can use the "Click" as below. Make sure you have reference to jQuery
<script type="text/javascript" src="/Scripts/jquery-1.8.2.min.js"></script>
Modify your Action Link as below.
#Html.ActionLink("Click", // linkText
"_Partial1", // actionName
null, // controllerName
new { #class = "detailsLink" } // htmlAttributes
)
Provide a element where you want to render the content.
< div id="details" />
Invoke the below JS, so the content will be loaded in the view or similar.
$(function() {
$('.detailsLink').click(function() {
$('#details').load(this.href);
return false;
});
});
This should invoke you partial action and renders the content on the same page.