I wan't to know if a hidden field essentially need to have a postback to send or access its value to server side?
for eg: if we have a hidden field x and it was set to some value in Javascript on client side. Can't we access this field on Server codebehind as soon as it set on client side without postback?
If you want just to get the value from hidden field on server side without sending the post request, you can send the AJAX call. I believe we would need to have more details from you to give more specific answer.
Additionally your postback work might be missleading.
Hidden field needs to be inside tag to send this to server. If you check the form tag you can manipulate the method attribute to send values with POST or GET request.
if you set the hidden field value at the client side script you can also send an Ajax request with the value to the server instead of getting the field value from the HTML DOM.
Example :
function setValue(fieldValue){
$("#hiddenField").val(fieldValue);
$.get( "/setfield?value="+fieldValue, function( data ) {
//handle response data if any
});
}
note that this specific solution requires JQuery, if necessary, you can achieve the same thing without it but it's more complicated.
Hidden Fields store the value in the page itself, hence do not use server resources.
Related
I am creating a small webpage which contains a drop down. So a user can select a value from it. This is in a form.
When the user selects a value from it say value "A", based on that I want to do a database query say, Select * from Table where value = 'A'. And display the result on the same page, preferably without full page reload.
I can access the value of the dropdown selected in javascript method by calling a method onchange event and doing document.getElementById on it.
How should I pass the value in a variable on the same html page, so that I can send the value to the database?
Thanks for your replies in advance.
This question itself is very vague, but I'll do my best.
You first need (if you don't already have) something server-side that can accept the incoming parameter and return the results from the database. e.g. /some/service/?param=DROPDOWN_VALUE_HERE. Ideally you would hit this service and receive back JSON/XML (something you can work with in the client).
Next, given you don't want a page reload, you need to look into how to leverage AJAX with reaching out to that service and dealing with the results. You should be able to send a request to the service (with the dropdown's value) and receive back something that would allow you to modify the page in a seamless way.
Use AJAX to send a POST request to the server asynchronously.
Using jQuery:
var value = 'A';
// make an HTTP POST request to the 'submit' route on your server
$.post('submit', {value: value})
.done(function(data) {
alert('Server response: ' + data);
}
On the server side, you need to handle the POST request to the 'submit' route and make your database call, and send back a response if necessary.
So, I know that when I submit a form whose method is POST that the server receives the contents of that form and then processes them accordingly, and then returns a page with the desired content. What I am trying to learn is what exact query url is being passed to the server side script when I submit a form on a website that does not belong to me. The reason I want this query string is so that I can make use of the server side script programatically with my own data. There is no public API served by this website, but I would like to formulate my own.
So my question is, is there a way to intercept the POST as a query string URL? Perhaps by using a javascript console in browser?
I know I can look at the source code for the page and find the names/values of the form fields. However, there also happens to be a hidden field on this page whose properties are set by javascript during validation at submission time. How should I go about this?
You can use an extension for intercept the data : Tamper Data on FireFox
https://addons.mozilla.org/fr/firefox/addon/tamper-data/
You can intercept and modify all headers requests
I want a scenario in which I will set some value of a hidden field in a particular page.
Then that page is submitted on server (form submit). Now, i redirect on another page and there I again try to retrieve the value which I set previously. But I am not getting there the value which was set, instead i get the default value which I provided in html page itself. (Hidden field is in header page which is common for all the pages in my web app).
i tried a dummy application in which i am getting the value of hidden field even after loading/refreshing the page once i set it.
When you redirected your user to another page, it became reloaded. Unless you chose to set a value to your form (by javascript for instance), the value of the form is the default one.
The value you "set previously" wasn't definitely associated to the input because everytime you reload the page, your server will generate again the HTML and the default values and your browser will display this HTML.
This behavior is normal.
Besides, if you want to keep the values of the form while submitting it, you can use AJAX submitting.
The other answers here are factually correct (that HTML doesn't normally do what you're asking it to do), but there are a few things you can do to make it work.
First, how things usually work: In order for the second page to get the proper value of the hidden field, you would process it in the server-side component. It sounds like you are redirecting to a new page in the server-side handler. The best way to make this work is to have that server-side handler process the value and attach it to the redirect as a parameter (likely attached to the querystring). Then have some server-side code generate the second page, which would process the querystring parameter.
Here's the work-around for pure-HTML/javascript implementation:
If you can't or won't have a server-side process to generate the second page, you could pull it out of the querystring using Javascript (just search for 'getting querystring variables in javascript').
If you use javascript, it could be feasible (though probably not advisable) to have the first form go directly to the second page by setting it as the form's action with a method of 'GET'. It's definitely better to include a server-side handler though.
What your trying to do is impossible through regular HTML since HTML is stateless. What you want is to put your values in a session or in a cookie and this way you can plant it on every page that is loaded.This cannot be done by default.
You're mis-understanding how HTTP works - it is stateless.
This means that every single page you request is completely separate to previous pages. Which is the reason your hidden textbox is being set back to default.
You have to explicitly set the value server side prior to it being sent to the client.
My HTML form is clearing automatically after I click the submit button. Any idea how to stop this from happening?
Here's the opening tag for the form:
<form onsubmit="return math()">
One popular approach is to utilize a server-side language such as PHP which reads all the get values and recreates the HTML of the page using a template and substituting in variables.
<input type = "text" name = "Textbox1" id = "Textbox1" value = "{$_GET[Textbox1]}"/>
I've written it out as $_GET directly, but you'd really want to make sure the value was scrubbed so you don't get arbitrary html injection.
A little bit more complicated you could approach this purely client side and utilize javascript to parse the address bar and extract the values submitted to your page (assuming it wasn't submitted with POST as the method). Then you can dynamically repopulate the fields client side.
when you click submit the page refreshes. You'll probably need to return a page with the value of the forms set to what was in when it was submitted.
If math() returns false your data won't disappear but it won't sent data to the server either. If you want to send data to the server you could make a XMLHttpRequest.
On my page
I have one textbox and one button.
-- on the button click event. -- one function will be called.
Now,
How to get that value of textbox and store in PHP variable? This should be done in that function which we will call on button click.
You'll have to know that Javascript and PHP run on two different servers. So they can not communicate directly.
You'll basicly have two options:
POST the value
Make a form with a post action, submit the form, and you can access the value in PHP with the $_POST array
Disadvantage is that the browser leaves the page to submit the form, but it doesn't require javascript.
Use AJAX
Get the value in Javascript, make an XMLHTTPRequest to the server, and you can access the variable too via $_GET or $_POST, depending on how you sent the value.
When your page is displayed, your PHP code has already been executed.
What you want to do is to learn AJAX, i.e. JS functions that call external PHP scripts.