I have a doubt. All right. I have a post in which users post comments and next to each post have a button belonging to each of them. Well, as I get when I click on each of these buttons me out a popup.
With that event ?. An event for several elements. But that is the same for all those buttons.
ahhh. These buttons are generated or printed with php, when the user posts something, that something has a button. Help!!!
HTML
<a id="popup" class="globes_post_giving">♠</a>
JS
<script type="text/javascript">
$(document).ready(function(){
$("#popup").on({ click:function(e){
alert('hola');
} });
});
</script>
The jQuery code seems not good.
There are syntaxes errors.
Here is my two cents :
<script type="text/javascript">
$(document).ready(function(){
$("#popup").click(function(e){
alert('hola');
});
});
</script>
In order to be used with multiple buttons you'd better use a class instead of an id and set the click event on it.
HTML
First link
Second link
Third link
JS
$(document).ready(function(){
$(".popup").click(function(e){
alert('hola');
});
});
That's all I can do without more code.
Hope it helps.
Related
I have a form that is dynamically created, so I can't edit the layout of the form itself. However, I want to add a title above one of the text input fields in the form. I have given that field a unique css ID and am using the following script to try and add my heading before it:
<script type="text/javascript">
$('<h5 class="form_title">Calculate Return</h5>').insertBefore('#price');
</script>
For some reason this won't work though, can anyone think why that might be. Here is the page in question
http://www.theres-a-thought.com/client-yourdream/?page=property_submit
Add document ready to your code -
<script type="text/javascript">
$(document).ready(function() {
$('<h5 class="form_title">Calculate Return</h5>').insertBefore('#price');
});
</script>
Looking at your page, I don't see where #price is defined. Maybe it is added later via JS and i missed it..
You are using jquery in no-conflict mode, and you need to wrap your code in document ready..
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('<h5 class="form_title">Calculate Return</h5>').insertBefore('#price');
});
</script>
Running this; however, has no affect on the page(from what i can see).
The code below works because the ID exists. It isn't what you are trying to accomplish, but it should get you started.
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('<h5 class="form_title">Calculate Return</h5>').insertBefore('#property_name');
});
</script>
My End goal is to have ajax displayed content be clickable to shove whatever it's value is into a text box.
Right now I have the ajax loading but when I click on it, it doesn't work. As of now I have jquery assigned the 'a' tag so when it's clicked it puts the static text "works" in the textarea with the id=email-body.
$(document).ready(function() {
// Expand Panel
$('a').click(function(){
$('#email-body').val($('#email-body').val()+'works');
});
});
This works just fine for a tags that aren't part of the ajax content but it doesn't work for the ajax content. Is there a special pull system I should use to have jquery effect ajax content?
Also static text and clicking on an a tag isn't really want I want.
Right now my ajax is doing the following:
foreach($search_found as $search_row){
$hint=$hint . '<a>'.ucwords($search_row['email_module_name']).'</a>';
}
echo $hint;
Is there a way I can have it be:
AJAX:
<div class="module" value="'.ucwords($search_row['email_module_name']).'">
'.ucwords($search_row['email_module_name']).'
</div>
JQUERY:
$(document).ready(function() {
// Expand Panel
$('.module').click(function(){
$('#email-body').val($('#email-body').val()+'$this->value');
});
});
What you want is to delegate the events, to do this you can use .on()
$(document).ready(function() {
// Expand Panel
$(documnet).on('click', 'a', function(){
$('#email-body').val($('#email-body').val()+'works');
});
});
You need to use the .on function:
$('div').on('click', '.module', function(){
$('#email-body').val($('#email-body').val()+'$this->value');
});
This allows the 'click' function to attach to the elements that are brought in via ajax.
You can use .on() to bind an event to current and future elements.
$(document).on("click", "a", function(){
$('#email-body').val($('#email-body').val()+'works');
});
Or,
$(document).on("click", ".module", function(){
$('#email-body').val($('#email-body').val()+'$this->value');
});
$('.module').live('click', function(){
$('#email-body').val($('#email-body').val()+'$this->value');
});
I figured it out and came back on to see someone posted .on
I tried this and it did not work. What did work was .live
I want to be able to click on a link lower down my PHP page, it send a variable and outputs the result in a <div> tag at the top half of the page.
I've linked to latest jquery, and so far I have this in my <head>:
<script type="text/javascript">
$().ready(function() {
$("#result").load("crimes_result.php");
});
</script>
And in my <body>:
<div id="result"></div>
What I need though, is that the div to be shown and depending on the result of a variable sent by a link the user clicks lower down the page.
like crimes_result.php?id=4334 or crimes_result.php?id=54543
How can I finish my script so it does that?
NOTE: I'm useless in ajax/jquery/javascript
If I understand correctly, simply call .load() from a click event and pass it the href of the link:
HTML:
<a class="loadlink" href="crimes_result.php?id=4334">Click Me<a>
JS:
$(".loadlink").click( function(event) {
event.preventDefault();
$("#result").load($(this).attr("href"));
});
Example: http://jsfiddle.net/jtbowden/ueucL/1/
I have a form with different options provided by radio buttons. I also have a script which displays different divs with different form inputs.
This script works fine, my problem is that I have a “previous” link where a user can go one step back and edit already entered data and that I can’t force the different options with the checked attribute to the radio button. It has to be clicked, which make sense because my script uses the .click event.
But how can I say something like: “If $_SESSION[‘unemployed’] == ‘yes’ then echo ‘checked’” and it shows the right option.
I hope I explained myself correctly otherwise fell free to ask.
Please see the code live here http://jsfiddle.net/GEFMX/1/ and my question is if one or more or the checkboxes default is "checked".
The Javascript I’m using looks like this:
<script type="text/javascript">
$(function() {
$("input[name$='step2_student']").click(function() {
var diffoptions = $(this).val();
$("div.studerende_janej").hide();
$("#studerende" + diffoptions).show();
});
$("input[name$='step2_otheredu']").click(function() {
var diffoptions = $(this).val();
$("div.othereducation_janej").hide();
$("#othereducation" + diffoptions).show();
});
$("input[name$='step2_haveeducation']").click(function() {
var diffoptions = $(this).val();
$("div.haveeducation_janej").hide();
$("#haveeducation" + diffoptions).show();
});
});
</script>
Sincere
- Mestika
You can add some code to your page load to trigger a 'click' for all radios that are checked. i.e. something like:
$(function() {
// .. bind your click events here
$('input[type="radio"]').each(function() {
if($(this).prop('checked')) $(this).click(); // trigger 'click' if checked
});
});
At the end of your document ready, add $("input[name~='step2_']:checked").click(). This will trigger the click event for already checked radio buttons, effectively displaying the divs.
I have realized a asynchronous treeview in php, now i want to add onclick event to the items in the treeview, and then make query in mysql.
Do you know how to do that?
Thanks a lot.
Edit:
Async.html:
<script type="text/javascript">
$(document).ready(function(){
$("#black").treeview({
url: "twodimen.php"
});
$("#black > li").live("click",function()){
$.get("");
})
});
</script>
<ul id="black">
</ul>
But when i add the $("#black > li").live("click", function()){}, the treeview doesn't display.
How to do that?
Well, this would be a start:
$("#treeview > li").click(function() { // this sets the onclick on your node
$.get('url_to_php_script_that_will_the_db'); // this calls an url using GET.
$.post('url_to_php_script_that_will_the_db'); // this calls an url using POST.
}
Suppose your treeview has id 'treeview', all the <li> under the treeview will have a click event. It's a rough start, but that's basically what you're looking for.