I have a button (styled as button with CSS). Next to it is an input field. I would like the button value to change dynamically as the user types a value in the textfield. What is the simplest way to do this?
My form:
<form>
<div class="span-3" id="bid_btns">
<div id="bid_button">
<?php echo $somethingwhichshouldchange; ?>
</div>
</div>
<div class="span-3 last" id="bid_btns">
<div id="bid_field">
<input type="text" class="title" name="bid_field" id="bid_field" maxlength="5"/>
</div>
</div>
</form>
PHP is a server side language, so you'll never be able to change a variable locally without re-serving the page. You need to investigate javascript to do what you're doing.
If you want to make the button label/value change as you type, PHP is not going to help. You need a script running in the browser - JavaScript. If you use jQuery (you did ask for the simplest way, and jQuery makes this much simpler), you need some code to change the button as the input value changes.
$(document).ready(function() {
$("#bid_field").keyup(function(){
$("#bid_btns").text($(this).val());
});
});
This bit of code will change the html inside the #bid_btns button to whatever is typed into the #bid_field input. If you're not familiar with jQuery, you can learn more by reading this article: http://docs.jquery.com/How_jQuery_Works
Note - edited per BenM's siggestion.
You can use jQuery to achieve this. You just need to bind a function to the onkeyup event:
http://jsfiddle.net/Vt6N9/
Related
I'm wondering if there is a way within my code where a user can click on an image, but on that click take the value of it and send via a post request to PHP code. For example at present I have this:
<div class="grid-2 dashboardIcons">
<h3 class="fontAmaticH1">Mindfulness</h3>
<a class="cursor" onclick="toggleWindow()"><img value="6" src="images/Mindfulness.png"></a>
</div>
Would I have to wrap this in a form tag like the below?
<form method="post">
<a class="cursor" onclick="toggleWindow()"><img value="6" name="module" src="images/Mindfulness.png"></a>
</form>
My PHP code will then just take that value and do something with it:
<?php
// I need to get the value from the clicking on an image
if(isset($_POST['module']))
{
//Do something
}
?>
Any help what so ever would be much appreciated!
using jQuery you can do something like this...
function toggleWindow() {
$("#theForm").ajaxSubmit({url: 'server.php', type: 'post'})
}
For this you can use AJAX where you can execute your JavaScript code using onclick event. In your JavaScript write down an AJAX script at the end so that it will execute the php code after execution of your JavaScript code.
I want to create a button with press & release actions, so, for example, when i press it, it shows some text and when i release it it hides the text. Can anybody help?
What i have already tried:
<form action="forwardon.php" method="get">
<input type="submit" value="Forward">
</form>
This just creates a button which redirects to a page which is running the desired action: but you cant create press & release actions with this..
And i cant find any way how to do this.. Or is it just not possible with php?
Well, yes. It's not possible with php, you need to use javascript for that.
Every button has events: onmousedown and onmouseup. You can see the list of events here
Basically, you need to create functions, that will be fired in javascript while pressing/releasing. It would look like this
<html>
<-- your html here -->
</html>
<script>
document.getElementById('id-of-your-button')
.addEventListener('mousedown', function() {
//change the text you need here with pure javascript
});
</script>
The same goes with onmouseup event too.
To know more about javascript visit w3schools
Like James already said. In PHP it isn't possible to make something like button events, because PHP is a ServerSideLanguage.
As he also mentioned, you have to use for example JavaScript.
With the following script you are able to change the text with mouse events
<input type="button" value="Forward" onmousedown="getElementById('text').innerHTML = 'pressed';" onmouseup="getElementById('text').innerHTML = '';">
<p id="text"></p>
PHP won't be able to do this without refreshing the page/going to a new page.
JavaScript can give you what you are looking for.
see w3schools first example for showing text.
Hope this helps
is it possible to somehow send $_POST[] data via a <a> tag? because it seems to automaticly execute the $_POST[] once the page loads rather than when I press the Anchor tag.
edit:
so what I'm trying to achieve is something like this:
I want an anchor tag which would normaly go to somepage.php?variable=something
but instead of using $_GET[] I want to send the variable via $_POST
Nothing in HTML will cause a link to trigger a POST request or encode data in the request body.
You can bind a JavaScript event handler to a link, cancel the default behaviour and then send a POST request by programmatically submitting a form or using XMLHttpRequest. This generally isn't a good idea and you should use a submit button instead (which you can style to look like a link if you really, really want to).
You can achieve this using jQuery and a HTML form
HTML:
<form method="post" name="redirect" class="redirect">
<input type="hidden" class="post" name="post" value="">
<input type="submit" style="display: none;">
</form>
Button: (html)
<a href='javascript:void(0)' class='button' var='DATAHERE'>sometexthere</a>
Javascript, or rather said jQuery:
$(".button").click(function() {
var link = $(this).attr('var');
$('.post').attr("value",link);
$('.redirect').submit();
});
this jQuery code listen's to any clicks on the items with the class button attached to them,
and reads out their "var" value, basicly you could use any kind of HTML element using this method as long as they have the button class attached to it.
Answer is no. What you can do is set the value of an input type when the <a> tag gets clicked. Using Javascript.
You could get hold of the query string from the href attribute of the anchor tag (you would need to parse the href and get hold of the string on the right hand side of the & symbol) and then post it using javascript or jquery (easier to use jquery).
http://api.jquery.com/jquery.post/
Would have to ask why you would want/need to do this?
Can anyone help me .I need php code for checking whether a div is clicked or not.
like,
if (isset($_POST['Submit1'])) { }
But instead of submit button i need a div ...
anyone help me please
thanks
You will need JavaScript for this as PHP doesn't access the DOM if I'm reading your question correctly. I would recommend you add jQuery lib to your page as it's simpler to add click event to a DIV, otherwise you have to add an event listener in javascript yourself for click events on the DIV.
jQuery: http://api.jquery.com/click/
DIY: http://www.codingforums.com/archive/index.php/t-122993.html
I can't tell if you want a div to be treated as a form element, like a checkbox, or if you want to use a div to submit a form.
Using it as a form element has been explained by Stano, if you want the div to submit a form, you really should just use a submit button. If you want to use an image instead of a button, using <input type="image"...> will function as a submit button.
If you really need to use a div to submit the form, you will need javascript. Something like this, we take a form named "bald" and when you click the div, the form "bald" is submitted as if you pressed a submit button.
<form name="bald" action="somefile.php">
<div onclick="bald.submit();">Click here to submit</div>
</form>
PHP can't tell you if a div has been clicked as php only works on the Server. For this you need javascript.
jquery makes something like this very simple.
Can't quite imagine what can be this test good for, but you can use javascript like this:
<div id="clickable_div" onclick="document.getElementById('divclicked').value='YES'"> SOMETHING </div>
in your form
<input type="hidden" id="divclicked" name="divclicked" value="NO"/>
and in php
if ($_POST['divclicked']=='YES') {...} else {...}
I have the following HTML page:
<div id="foobar">
<?php echo $dynamicVar; ?>
</div>
<input type="button" value="Submit" id="subButton"/>
When I press submit, the value of $dynamicVar will change. Is there a way, without using Ajax callbacks, .each(), or anything complicated, to do a dead-simple refresh of the div element? I know there's a jQuery function, I've seen it before, but I can't find it now. This function will just refresh an element. Everything I've found requires me to write unnecessarily complicated code to attempt to refresh a very small very simple element.
For example, if the the entire div had the value "1" inside of it, and I pressed the button, I want to refresh in order to show the value "n".
Here's the jQuery code:
$('#subButton').live('click',function() {
//dead-simple element refresh, nothing fancy necessary
});
Example #2:
<div id="foobar">
<?php echo time(); ?>
</div>
<input type="button" value="Submit" id="subButton"/>
Since time generally goes forward, the timestamp should be different from a few seconds ago when the web server gave me the timestamp. I would want to have the div element do a very simple update of itself so that I would see the new timestamp upon button click.
Any help?
Were you thinking of .load()? It's a high-level ajax function. You'd use it something like this:
$('#subButton').live('click',function() {
$('#foobar').load('thispage.php #foobar > *');
});
You'll have to use AJAX AFAIK, but in your $.ajax() callback, you can use $.replaceWith() (documentation).
$('#foobar').load('my/script.php');