I have form on the page, in the background I gather make an array of data that I want to pass to a back end controller. I can $post but I don't want the request to be ajax. I want to submit the array along with form, when the user presses the submit button. Does Javascript allow this anyway?
You can use iframe if you donot want to use ajax.
To POST to an iframe you must use form target.
Sample code :
<form
id="moodleform" target="iframe"
method="post" action="http://www.example.com/login/index.php"
>
<input type="hidden" name="username" value="guest"/>
<input type="hidden" name="password" value="guest"/>
<input type="hidden" name="testcookies" value="1"/>
</form>
<iframe name="iframe"></iframe>
<script type="text/javascript">
document.getElementById('moodleform').submit();
</script>
Why not have a hidden field that you populate with a serialized version of the data?
Alternatively, you could have multiple hidden input form elements with the same name, which (back-end application dependant) should give you the POST variable as an array of values.
Building on that, you could add the hidden input elements dynamically to the form.
Related
I basically have a search box, I am trying to get the value inserted and use on a separate /results.htm screen via the submit button. I've been able to get and process the results within the same page; but I am trying to do this after redirecting to a new page
/search.html
<script>
jQuery(document).ready(function() {
jQuery("#submit").click(function() {
var ZipSearch = jQuery("#Zipcode").val();
});
});
</script>
<div class="search_bar">
<form action=""><input type="text" name="Zipcode" id="Zipcode" value="" maxlength="5" placeholder="Zipcode">
<input type="button" name="submit" id="submit" value="Submit"/></form>
</div>
Want to keep input value content from /search.htm within a variable on next page, separate, /results.htm
How can I keep the user input value and use on my separate 'results' page?
Remove all the JavaScript from search.htm. There's no point in writing custom software to do things HTML has built-in.
Set the action of the form to the URL of the second page (action="/results.htm").
Change the button to a submit button (type="submit")
Read the data from the query string (location.search in JavaScript or $_GET in PHP).
EDIT: I should mention the form submits fine manually but with the javascript nothing seems to happen
I'm trying to get a form to autosubmit on page load and then redirect the user. Reason for this is this is part of a PHP page and the data needs to go into my database but then also POST the variables to a 3rd party SMS platform then return to the users dashboard.
My form looks like this:
<html>
<form action="https://www.example.com" id="myForm" method ="POST">
<input type="hidden" name="apiKey" value="withheld">
<input type="hidden" name="message" value="<?php echo $club_name ?> have requested you to play for them this weekend. Please login to your account to see more information and accept.">
<input type="hidden" name="to" value="<?php echo $to ?>">
<input type="hidden" name="from" value="withheld">
<input type="submit" name="submit" id="submit" value="Submit">
</form>
</html>
This seems to work fine so I assume the Javascript is incorrect which is:
<script>
document.getElementById('myForm').submit();
window.location.replace("https://www.example.com");
</script>
You have to use a different name than
name="submit"
as all name attributes are set as properties on the form,
hence overriding the default "submit" property on the form,
and the default form method "submit()" is gone.
https://developer.mozilla.org/de/docs/Web/API/HTMLFormElement
"Named inputs are added to their owner form instance as properties, and can overwrite native properties if they share the same name (eg a form with an input named action will have its action property return that input instead of the form's action HTML attribute)."
In your code window.location.replace("https://www.example.com"); line won't make sense because submit() function will try to submit the form and will change the page and then replace function will prevent submitting the form and will redirect the page. The right way to do this via js can be, submit the form via ajax and in the success callback of Ajax run document.getElementById('myForm').submit()
what i am trying to achieve is that i want to load an iframe and send some data using the post method.
I want it to happen programmatically so i don't want a user click.
here is the code that i have come up so far.
In my view i have the following:
<form id="submitValues" target="siteFrame"
enctype="application/x-www-form-urlencoded"
method="POST" action="http://localhost/PHP/dataSender.php">
<input type="text" name="jwt" ng-model="jwtData"/>
<input type="hidden" name="name" ng-model="Hiddenname"/>
<input type="hidden" name="type" ng-model="typeData"/>
</form>
<iframe name="siteFrame" id="siteFrame"
seamless="seamless" onLoad="iframeLoadDone()"></iframe>
Note that the target of the form is the iframe.
In my controller i am doing this :
$scope.jwtData="someData";
$scope.Hiddenname="someData";
$scope.typeData="someData";
document.getElementById('submitValues').submit();
The value in the ng-model are not getting sent, they do show up in the view if i remove the "hidden" value form the inputs.
How to send the values?
I was wondering how can I submit div data to MySQL. Im not used to javascript so I dont really know whats happening on the javascript part but how can I get or input the action="" part and method="" part and can I or should I add value="" to the hidden input???
Form html code:
<form onsubmit="document.getElementById('hidden_data').value=document.getElementById('showing_data').innerHTML;">
<input id="hidden_data" name="data" type="hidden"/>
<div id="showing_data" class="commenttext" contenteditable="true"></div>
<input type="submit" Value="Enter" id="submitthis">
</form>
Use the hidden field inside the form tag and use the JavaScript to put the value inside it. You can get the hidden field in the $_POST['hydName'].Put the data on the click of the submit button into the hidden field. Keep your action and method of the form same as required. After the click event is fired, it will submit the form to its action URL
<input type="submit" onclick="document.getElememtById('hidden').value = document.getElementById('div').innerHtml;" />
For example, the website https://talky.io/ has a form on its homepage. When you enter text into the form and hit the button, you're taken to a page that's https://talky.io/[your text]. How do you do this? What's the best way to do it?
Thank you!
You can use onSubmit and change the action attribute of the form via javascript, then return true. The code could look like this:
HTML from linked page:
<form id="createRoom">
<input id="sessionInput" placeholder="Name the conversation" autofocus="autofocus">
<button type="submit">Let’s go!</button>
</form>
Js code:
document.getElementById("crateRoom").onsubmit = function(){
var url = encodeURIComponent(document.getElementById("sessionInput").value);
document.getElementById("crateRoom").action = "/" + url;
return true;
}
It is server-side script job. You can look at some MVC framework and the url parameters
You can use GET method of form;for example:
<form action="index.php" method="get">
Page: <input type="text" name="page">
<input type="submit" value="Submit">
</form>
that after submit will go to index.php?page=yourEnteredPage.
You can use PHP symfony or codeignitor, if you use .net then create a new MVC project.
But if you only need to change urls like
www.mysite.com/mypage.php?something=value
to
www.mysite.com/value
You can do a mod rewrite in apache or if you're using .net then use RegisterRoutes in your global.asax.cs
Using a form you can submit data to a location/url that was given in the action attribute of the for, for example
<form method="POST" action="http://example.com">
<input name="first_name" type="text" value="" />
<!-- Form elements -->
<input type="submit" name="mySubmitButton" value="Submit">
</form>
This form will submit the form data to the given action url when submit will be pressed and on the derver data could be retrieve using
$first_name = $_POST['first_name';];
and so on. The method POST is used to submit the form in the post array so you can retrieve data using $_POST['formfieldname'] and if you use method="GET" then you can get submitted data from $_GET variable, like, $fname=$_GET['first_name']. GET has limitation of amount when submitting data (safe to use up to 2000 characters IE's limit) and is visible to address bar of the browser and not being used for login (password) and POST can send more data than GET and also not visible to address bar.
You may read this.
Fairly possible with URL Rewriting
http://en.wikipedia.org/wiki/Rewrite_engine