I checked on duplicate threads but did not work. I just need to close browser after I click close. but it is firing Controller [HttpPost] method instead of close the browser.
browser is closing if open the same url from another window.
view
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
#Html.ValidationSummary(true)
.....
....
<td align="right">
<input type="submit" name="btnSave" value="Save" id="btnSave" />
<input type="submit" name="btnCancel" value="Cancel" id="btnCancel" />
</td>
}
JS
<script type="text/javascript">
$(document).ready(function () {
......
$("#btnCancel").click(function (event) { window.close(); });
});
Controller
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Index(List<CustomerCommPreferences> lstcustCommPref, bool chkSolicitation)
{
}
Console warning show Scripts may not close windows that were not opened by script.
JavaScript can only close the windows it has opened. For example:
var yourWindow = window.open('http://google.com');
You could then use yourWindow.close();
The reason why you are hitting the controller is because you have two buttons which are inside a HTML form. When these buttons are clicked the form is submitted back to the server.
Related
I have two submits, one to submit the form on page 1, the other to submit form on page 1 and redirect to form 2 on page 2.
<input type="submit" value="Submit and Add Expense" onclick="window.location.href='#Url.Action("Create", "Expense")';"/>
The issue is, when this secondary submit button is clicked it just submits the form just like the first submit button. It appears that the redirect #url.action is not firing. Thoughts?
The following code should do the trick.
<input type="submit" id="btnOne" value="One"/>
<input type="button" id="btnTwo" value="One"/>
<script>
var sample = sample || {};
sample.url = '#Url.Action("Create", "Expense")';
</script>
//you can move it to a separate file
<script>
$(function(){
$("#btnTwo").click(function(){
var form = $("form");
form.submit();
setTimeout(function() {
window.location.href = sample.url;
},100);
});
});
</script>
I wound up going the easy route of assigning value property to the button, and then checking the button value in the controller.
// View
<input type="submit" value="Submit" />
<button name="button" value="SubmitAndExpense">Submit and Add Expense</button>
// Controller
[HttpPost]
public ActionResult Create(string button)
{
if (button != "SubmitAndExpense") {...}
}
I am using Spring controller, jsp as view with javascript and html as front end view. I have popup window, When I submit the button, it should redirect to controller class.
JavaScript code with html:
<%#taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
loginQB = function(){
var win = window.open('about:blank', 'popup', 'width=640,height=580,resizeable,scrollbars');
<!-- win.document.write('<%#taglib uri="http://www.springframework.org/tags/form" prefix="form"%>');
win.document.write('<form:form id="qblogin" method="POST" action="/asi/mappings">');--!>
win.document.write('<br>Sign in with Intuit Account or CreateOne');
win.document.write('<br><input type="text" name="userName">');
win.document.write('<br><input type="password" name="password">');
win.document.write('<br><input type="submit" value="Submit">');
<!--win.document.write('</form>');-->
}
</script>
</head>
<body>
<form:form id="qblogin" method="POST" onsubmit="loginQB(); return false;">
<select name="quickbooks" id="qb" >
<option value="qb-1">Books Desktop</option>
</select>
<input type="submit" value="Submit">
</form:form>
</body>
</html>
Spring controller class:
#Controller
#SessionAttributes("mappingSession")
public class MappingsController {
#RequestMapping(value="/mappings", method = RequestMethod.POST)
public String dataMappings(Model model) throws Exception {
DefaultHttpClient httpClient = new DefaultHttpClient();
First of all, why don't you use Bootstrap Modal for your pop up.
http://getbootstrap.com/javascript/#modals
Secondly, when you submit, you can get the information from your form, serialize it and then pass it to the controller.
http://api.jquery.com/serialize/
I strongly recommend you to change the implementation of your popup.
I am trying to send a JS variable using html beginform to controller action. Eg:
#using (Html.BeginForm("Index", "Contrl1", new { SPName = myJSVarcomeshere }, FormMethod.Post))
{
<button id="plot" type="submit" class="btn" > Plot </button>
}
Currently the problem is the JS var is not in scope. Can I use a hidden field to achieve this
Yes you are right. The #using statement which writes our your form is executed on the server - the Javascript variable is only present on the client. Therefore you will have to use a hidden field inside the form and populate that field with the value of your javascript variable. You need to do that once the document has loaded or somewhere below the hidden field.
Example:
#using (Html.BeginForm("Index", "Contrl1", FormMethod.Post))
{
<input type="hidden" name="SPName" id="SPName" />
<button id="plot" type="submit" class="btn" > Plot </button>
}
Then, use JS to populate the hidden field:
JQuery version:
<script>
$(function(){
$('#SPName').val(myJSVarcomeshere);
});
</script>
Plain JS version:
<script>
window.onload = function() {
document.getElementById('SPName').value = myJSVarcomeshere;
};
</script>
-- EDIT: This turns out not to be a js issue but a "Mixed Active Content" issue in Firefox 24.0. --
Locally, an event handler correctly intercepts a form submission; however, on Heroku, the application instead issues an HTTP request and the appropriate Javascript function is never called.
My webpage has the following Javascript:
<script id="infrastructure-cxn" type="application/javascript">
$(function () {
// [additional code ... ]
$("#message-form").submit(function (event) {
event.preventDefault();
var msg = $("#msg-input").val();
var msgObject = { text: msg };
server.publish(channel, msgObject);
});
});
</script>
My webpage has the following form:
<form id="message-form" accept-charset="UTF-8">
<!-- [additional code ...] -->
<div class="field">
<input
id="msg-input"
type="text"
placeholder="Enter message..." />
</div>
<input
class="btn btn-xs btn-primary"
type="submit"
value="Send" />
</form>
Could anyone offer any suggestions as to how I can fix my application so that in production it doesn't issue either GET or POST requests but instead calls the anonymous function in my event handler?
I have Liferay dialog box, I want to close this dialog box and wish to redirect my url to a page.
I am doing it this way.
<aui:column columnWidth="16" >
<%if(UserGroupRoleLocalServiceUtil.hasUserGroupRole(u.getUserId(), groupId, role.getRoleId())){ %>
<input value="delete" type="button" onclick="document.location.href='
<portlet:actionURL name="deleteUserRole"><portlet:param name="memberId" value="<%= memberIdStr %>"/>
<portlet:param name="organization" value="<%= Long.toString(organizationID) %>"/></portlet:actionURL>'" />
<%} %>
</aui:column>
public void deleteUserRole(ActionRequest actionRequest,ActionResponse actionResponse){
// process to delete user role
Role r = RoleLocalServiceUtil.getRole(org.getCompanyId(),
"Power User");
UserGroupRoleLocalServiceUtil.deleteUserGroupRoles(userID, groupId, new long[] { r.getRoleId() });
actionResponse.sendRedirect("/group/employee/empHome");
}
By using this way when I click on delete button this method gets call, perform process and it redirects to this url but withing popup window.
I want to redirect to given page in actionResponse.sendRedirect page but not in dialog box, it should not open in dailog box.
How can I close this dialog box first and then redirect my page to given url?
I am opening dialog box by calling this class on a link
Below is my js file
/test.js/
var myPopup;
AUI().ready( function() {
if (AUI().one('#testing-menu')) {
AUI().one('.extendClick').on(
'mouseenter',
function(event){
AUI().one('.navi-type').setStyles({'display': 'none'});
AUI().one('.extendClick').setStyles({'display': 'none'});
AUI().one('.collapseArrow').setStyles({'display': 'block'});
}
);
AUI().all('.employee-dialog').on(
'click',
function(event){
var url = event.currentTarget.get('href');
event.preventDefault();
//console.info(url);
window.myPopup= Liferay.Util.openWindow(
{
dialog: {
align: { points: ['tc', 'tc'] },
width: 960
},
title: 'Settings',
uri: url
}
);
}
);
}
});
Save the popup reference, and use that to close the popup later:
var myPopup;
AUI().all('.employee-dialog').on(
'click',
function(event){
[..]
myPopup = Liferay.Util.openWindow([...]);
}
);
Use the saved popup reference in onclick:
<input value="delete" type="button" onclick="myPopup.close();document.location.href='
[...]
Finally I am able to close this dialog box in this way.
<input value="delete" type="button" onclick="javascript:closePopUp;document.location.href='
<portlet:actionURL name="deleteUserRole"><portlet:param name="memberId" value="<%= memberIdStr %>"/>
<portlet:param name="organization" value="<%= Long.toString(organizationID) %>"/></portlet:actionURL>'" />
<script type="text/javascript">
function closePopUp(){
top.document.getElementById('closethick').click();
}
</script>