Is it possible to have multiple target pages with cross page posting?

Question

I have a web page that uses cross page posting to post to a different target page.

A new requirement has arisen that means that there could be 4 different target pages to post too depending on what data was entered on the client.

Is it possible to somehow change the cross page posting target dynamically on the client?

From looking at the source html I guess it would be possible to use jquery to manipulate the postback target on the submit button, but this seems a bit of a hack.

What are my alternatives, rewrite the pages to remove cross-page posting and do a response redirect passing the data in session?

Answer 1

You may try changing the action attribute of your form using JavaScript, just before form submission.

Unfortunately, most browsers do not support POST redirection. Even RFC notes:

RFC 1945 and RFC 2068 specify that the client is not allowed to change the method on the redirected request. However, most existing user agent implementations treat 302 as if it were a 303 response, performing a GET on the Location field-value regardless of the original request method. The status codes 303 and 307 have been added for servers that wish to make unambiguously clear which kind of reaction is expected of the client.

So, IMHO, the choices are limited to either JavaScript action modification or re-POSTing data from your server (your server accepts the POSTed data, analyzes it and performs POST by itself).

Storing data in session (or just returning it on POST) and then re-POSTing it from the client requires either JavaScript support (to automatically submit the form) or making user click "submit" button one more time. You may consider using this method as a fallback, though.

Make default action point to your fallback script. If you succeeded to modify action before submission — everything is okay at this point. If something failed, like in case JavaScript being disabled — make your fallback script output page with a hidden data field (so it should not be modified anymore) and visible submit button, POSTing data to a proper location.

Answer 2

Yes you can certainly change the action of the form. I'll walk you through how to do it.

First, your form must have a name and an action URL specified in the HTML:

<form name="aformiam" method="post" action="/somewhere/to/go.php">

Next, you're going to want to run some JavaScript on form submission, so you should set the onClick property of your submit button to a function, such as the following:

<input type="submit" value="Send Form" onClick="return submitForm();" />

Finally is your JavaScript function to actually change the form action and submit the form.

function submitForm() {
  // do anything here you need to determine which URL to post to
  // I am just making an example here
  var targetURL = '/some/url/to/post.php';

  // now we will change the form's action
  document.aformiam.action = targetURL;

  // finally, submit the form by returning true
  return true;
}

Note that in the last step where we return true, this submits the form because the input element's type is submit and the function is triggered by the onClick event. If this were, for example, a button type input element, or an a tag or img then we would need to trigger the form to submit using something like the following:

document.aformiam.submit();

This solution will work to change the action and submit to a single URL. If you need to post to multiple URLs at once, you will have to make use of other methods such as XMLHttpRequest. If this is the case, post a comment indicating so and I'll provide an example for that.