I've got a form that has three submit buttons for posting back data for different scenarios.
Each one POSTs to different actions on a controller, however for one of them I need to POST back to a new browser window.
Is this possible? I know I can add a target="_blank" to the form, but that will open a new window for all of the submit buttons...
UPDATE:
Currently, I've tried several methods to get this working and I've completely failed, my current non-working code looks like this:
$("input[type=submit]").click(function (e) {
var form = $("form.filter-execution-form");
if ($(this).hasClass("run-report"))
$("form.filter-execution-form").attr("target", "_blank");
else
$("form.filter-execution-form").removeAttr("target");
});
Does anyone have any ideas to get this working?
Thanks,
Kieron
See this post - use the same method to dynamically add the attribute for the submit button you want it for (ie add it to the onclick event of your submit button you want to add this support to)
How do I add target="_blank" to a link within a specified div?
There are probably a number of different ways to do this. The easiest I can imagine is when the submit button is pressed in the first window, you open a new window with a URL (on the same domain) that has the desired form in it (may have to watch out for pop-up blockers). Then, transfer the data that has been entered from your existing form to the form in the new window. Call a javascript function in the new page that tells it to submit the form.
In the form set target="postWindow" or any other name that is the same throughout, and it will always post to that popup (if it was not closed).
The best way I can think of doing this (and it might not be the best way of doing it) would be using JavaScript.
When you click the button, prevent it doing anything but run some javascript instead, open a new window on a blank page, with a hidden form in it, use javascript to transfer values from your form to the new pop-up form, submit the pop-up form & do something with original page to show an action was taken.
Related
I'm working on a web app that takes the user through multiple forms with simple interface of a 'back' button, form, 'save' button and a 'next' button.
Clicking 'save' only calculates a number from given answers and sends it to localStorage.
When I then click 'next', it opens the next html file I prepared, constructed the same way, just with a different form. The problem is that if I press 'back', the form on the first page is empty, but when I use the browser's 'back' button, it's all there. How do I get this result with my 'back' and 'next' buttons? I'd like the user to be able to browse their answers as well as see a certain form already completed if they encounter it on a different path (there are various paths through 3 to 5 of 11 forms created, depending on what the user wants to calculate).
I understand it's opening the html file every time I click an 'a href', but I don't know how to change it. I tried searching for html form reloading prevention etc. but it doesn't seem to yield any answers. I'm not sure I know how to formulate my problem in a simple enough way.
Best simple solution would pretty much be what "Manolo" suggested.
Put all the forms you need in one HTML doc
Set all the form's style to "display: none" except the first
Create a simple JS function that changes the "display" style accordingly and attach it with the "onclick" attribute to your buttons.
Sorry for the lack of code. Typed this on mobile and hoped it would be straight forward enough. Hope this helped.
Load the forms as you need them using javascript to request them to your server. Use fetch api.
Other solution is to add all the forms to one page and hidde them all from the user. When the user click next you hide firstForm and show secondForm.
You can use History_API of DOM to manipulate the history
let stateObj = { foo: "bar" }
history.pushState(stateObj, "page 2", "bar.html")
And can catch thee event of back and next button of navigator with
WindowEventHandlers
Here's the situation.
A user goes to the #new action, clicks submit form, and the object is created. The user is shown the show page
The user realizes something is wrong, so they click back (even though there's clearly an edit button there)
The user fixes whatever needs fixing and clicks submit again, thus creating a new object
What I want to do is have the user directed to the edit action when they click back on the show page. It's also got to be IE 7+ compliant. Is this possible?
Another alternative I was considering was creating a random string on a hidden field on the #new page, and using that to check whether the object's already been created.
Thoughts?
I would use in javascript
document.referrer
on the new page to see where the user came from and if it's the created page, you can then do whatever is necessary to go to the edit view.
This is a plain javascript question.
I have a page C in which sits a textarea T.
T's content gets added to by clicks on various buttons on C (essentially T accumulates the list of times at which the buttons were clicked).
There is also a button to submit the contents of T by a post request to a server (T being surrounded by a form element).
When the user forgets to click the submit button and closes the page's window, I want the posting of T's contents to happen anyway, just as if the user had clicked the submit button before closing the window.
I know I can intercept the page closing and prompt the user to do the submit, but that is NOT what I want.
It seems to be impossible to submit the form containing T from inside a function that is called by onbeforeunload.
Thanks for any tip.
This is simply not possible : this is a security measure designed to ensure a site can't prevent a user instantly leaving a page if he wants to.
The best you can do is posting your form using ajax each time a field is changed.
I've used this code in part of my application - it doesn't capture any text though but you could give it a try.
window.onbeforeunload = confirmExit;
function confirmExit(){
data = $("#data").val();
$.ajax({
url: 'complete.php?data=' + data
});
}
I see this pattern used very often!
Click on a link
popup appears with a form
fill in form and submit
popup closes and main page populates itself with the form's data.
Any idea how this works?
Edit:
by popup I mean an actual window popup, rather than a modal window. A modal window could work nicely though I reckon.
Do you want something like this ?
http://jqueryui.com/demos/dialog/#modal-form
http://jqueryui.com/demos/dialog/modal-form.html
You can validate the form with js / jquery and then do an ajax call and post the data to the server
The only way to do this is with Javascript. Django's own admin includes a (fairly clunky) example: when you save the popup, it returns a response consisting of just a <script> tag containing Javascript which references the box in the parent form. See for example django.contrib.admin.options.ModelAdmin.response_add.
You can use somethign like facebox to create the popup. This requests a page to the server (your form). Once submitted, detect that the facebox was closed (see the API) and make a new ajax request to the server that will return the needed data to populate your page.
I have an OnBase e-Form that I'm building. There are three buttons on the form that all submit. OnBase does different things based on the name of the button used to submit the form. If the button has a name of OBBtn_CrossReference it opens another window with a cross referenced document. I need to programmatically 'click' that button.
I've read several posts about how to use JavaScript to submit a form, but none seem to accomplish my goal. I just need to POST and to have it appear to come from a button named OBBtn_CrossReference.
I don't need to submit any data. The way the page is currently set up, the entire page is already a form and since I don't want to break the functionality of the other form buttons it seems I must leave it that way.
UPDATE:
The suggestion below was tested as a call from the onload event in the body tag and since the button posts the page reloads and the call is made over and over again spawning unlimited child windows. I would appreciate a suggestion on how to get the button to only be clicked the first time the page is loaded and not on postback.
There's a click() method on links, buttons, checkboxes. For example , I submitted this comment by running document.getElementById('submit-button').click() from chrome's command line.
I know I am a little late to this post, but you can try and leverage a cookie to get this done:
if (document.cookie.indexOf('xref=true', 0) < 0) {
// Set the xRef cookie, so we do not fire it again for this form.
document.cookie = 'xref=true';
//alert(document.cookie);
document.getElementById("OBBtn_CrossReference").click();
}
else {
document.cookie = "xref=false";
//alert(document.cookie);
}
I tested this on the Thick and Thin clients in 10.0 and it worked fine.
The postings on this site are my own and don't necessarily represent my company's positions, strategies or opinions.