I have a piece of javascript code that causes a text box to appear adjacent to a drop-down menu when a certain selection is made. It worked perfectly until I embedded it in html. I'm not sure why it's not working now, although it's probably really trivial.
Here is the function, as it is now:
$public->html .= '<script type="text/javascript">;
$(function(){
// initially check the default value in dd_question
if($("#dd_question").find("option:selected").val() == "0"){
$("#other_question").show();
}else{
$("#other_question").hide();
}
$("#dd_question").change(function() {
if($(this).find("option:selected").val() == "0"){
$("#other_question").show();
}else{
$("#other_question").hide();
}
});
});
</script>';
It would be great to have this working again. Can anyone see why it's not?
I'm not php user but i can tell you that the semi colon at this line probably shouldn't be there.
$public->html .= '<script type="text/javascript">;
Waste of code
<script type="text/javascript">
$(function() {
$("#dd_question").change(function() {
var show = $(this).val() == "0";
if (show) $("#other_question").show();
else $("#other_question").hide();
}).change();
});
</script>
Related
Thank you very much for your help. I have the following file. The two alerts in the jquery event listener both work, but not the one inside the if (isset) block, as it is posting to itself. Thank you very much! I have abbreviated the code, everything is inside its proper tag.
<?php session_start();
include("config.php");
$myID = $_POST['chatid'];
$_SESSION['chateeID'] = $myID;
if(isset($_POST['inputmessage'])) {
echo '<script type="text/javascript">alert("got in here");</script>';
$sMessage = mysqli_real_escape_string($_POST['inputmessage']);
if ($sMessage != '') {
$sql = "INSERT INTO chatmessages (user_one_id, user_two_id, mymessage, action_user_id)
VALUES ('$user1', '$user2', '$sMessage', '$action_user_id')";
// Perform a query, check for error
if (!mysqli_query($con,$sql)){
echo '<script type="text/javascript">alert("'.mysqli_error($con).'");</script>';
}
}
}
<script>
$('#ChatInputBox').keydown(function (e) {
var keyCode = e.keyCode || e.which;
var txt = $("#ChatInputBox").val();
if (keyCode == 13 && txt!="") {
alert("txt is: "+txt);
$.post("inserttochat.php", { inputmessage: txt }, function(result){
alert("got to callback!");
});
}
});
</script>
I did this exactly the same way on another page but cannot find the discrepancy here.
After setting up your code on my development system I discovered that the short piece of script your PHP code is sending is being sent correctly, and being received correctly but not being executed by the jQuery AJAX code.
If you want that alert to show up in your page you need to place it in an HTML element
<div id="response"></div>
then
$.post("inserttochat.php", { inputmessage: txt }, function(result){
alert("got to callback!");
$("response").html(result);
});
A better way to do this is to echo some sort of status as a JSON object, then unpack that into an alert in Javascript.
echo json_encode((object)['status'=>'ok', 'msg'=>'All good']);
then
$.post("inserttochat.php", { inputmessage: txt }, function(result){
alert("Response: "+result.status+', '+result.msg);
},'json');
Note the json datatype added to the POST request*.
A better approach here is to standardise all your responses as JSON, and then add header("Content-type: application/json"); at the top of your PHP files. This will tell jQuery what the data is, rather than you having to force the issue in the browser.
I don't know if this is possible as i know php is server side and javascript is client side.
But i am trying to run this javascript code from an if isset inside a php page.
I am using this code:
<?php
if( isset($_POST['submit2'])){
echo "
<script type=\"text/javascript\">
$(document).ready(function(){
setTimeout(function () {
doWork();
window.location.reload();
}, 2000);
function doWork() {
$('#submit').trigger('click');
}
});
</script>";
}
?>
this javascript should click on the button named (submit) and it works fine if its not inside the PHP echo.. and I also checked to see if the if if( isset($_POST['submit2'])) actually returns a value and it does and it works as it should.
So, I don't know what the issue is here>
can some one please help me out with this?
I have always found it best to keep my main javascript/jquery code within the head tag and use php to check and set variables that allow my scripts to run; echoing a javascript boolean into my JS block using php. This way you know that the javascript is doing what it should natively and not worry about elements not being treated properly in the DOM.
So I would do this (I don't know the order in which you want things to happen so this might seem out of order but the principle should still be the same):
<?php
if( isset($_POST['submit2'])){
$varSet = "var set2 = 1;";
} else {
$varSet = "var set2 = 0;";
}
?>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type=\"text/javascript\">
$(document).ready(function(){
<?php echo $varSet; ?>
if(set2 == 1){
setTimeout(function () {
doWork();
window.location.reload();
}, 2000);
function doWork() {
$('#submit').trigger('click');
}
}
});
</script>
</head>
I'm trying to display a hyperlink that has a colorbox popup associated with it.
The javascript is:
function bid() {
var bid = document.getElementById("bid").value;
if (bid>0 && bid<=100) {
var per = 3.50;
} else if (bid>100 && bid<=200) {
var per = 3.40;
} else if (bid>200 && bid<=300) {
var per = 3.30;
}
var fee = Math.round(((bid/100)*per)*100)/100;
var credit = 294.9;
if (fee>credit) {
var message = 'Error';
} else {
var message = '<a class="popup" href="URL">The link</a>';
}
document.getElementById("bidText").innerHTML=message;
}
The javascript works fine and displays the link in the right conditions, the problem however is that when clicking the link, the Colorbox isn't being applied and the page loads as a normal hyperlink.
I have the following code in the header:
jQuery(document).ready(function () {
jQuery('a.popup').colorbox({ opacity:0.5 , rel:'group1' });
});
If I output just the hyperlink in the standard html source, it works fine and displays correctly in the Colorbox.
Any help would be greatly appreciated :)
You need to wait until you've appended the link before you call the colorbox() method on it.
Move your colorbox() method so that it comes after your innerHTML.
jQuery('a.popup').colorbox({ opacity:0.5 , rel:'group1' });
when adding html dynamically you, the event added already can not be triggered.
try the following code
jQuery(document).ready(function () {
$("a.popup").on("click", function(event){
applycolorbox($(this));
});
function applycolorbox($elem) {
$elem.colorbox({ opacity:0.5 , rel:'group1' });
}
i have one php function which verify admin login like that
if($vAdmin==1)
{
$_SESSION['admin']="admin";
header("location:index.php");
}
else
{
$errMsg="Invalid Username or Password.";
}
This work perfect but i want to show the div which show the error message, so i defined the div like this and its hidden div in style.
<div class="notification">Invalid username or password. (Type anything)</div>
i have changed the above function to
if($vAdmin==1)
{
$_SESSION['admin']="admin";
header("location:index.php");
}
else
{?>
$('div.notification').fadeIn();
setTimeout(function() {
$('div.notification').fadeOut('slow');
}, 3000);
<?}
?>
my basic purpose is when its not verified just show the div and hide it.
but its not working?
Thanks
Change the else part of your code to the following:
else
{
echo <<<EOD
<script type="text/javascript">
$(document).load(function() {
$('div.notification').fadeIn();
setTimeout(function() {
$('div.notification').fadeOut('slow');
}, 3000);
});
</script>
EOD;
}
I'm also assuming you're including the jQuery library somewhere prior to where this script tag is added. If you're not, make sure you do.
You need to output the javascript within script tags.
I have the following jquery code
$(document).ready(function() {
//Default Action
$("#playerList").verticaltabs({speed: 500,slideShow: false,activeIndex: <?=$tab;?>});
$("#responsecontainer").load("testing.php?chat=1");
var refreshId = setInterval(function() {
$("#responsecontainer").load('testing.php?chat=1');
}, 9000);
$("#responsecontainer2").load("testing.php?console=1");
var refreshId = setInterval(function() {
$("#responsecontainer2").load('testing.php?console=1');
}, 9000);
$('#chat_btn').click(function(event) {
event.preventDefault();
var say = jQuery('input[name="say"]').val()
if (say) {
jQuery.get('testing.php?action=chatsay', { say_input: say} );
jQuery('input[name="say"]').attr('value','')
} else {
alert('Please enter some text');
}
});
$('#console_btn').click(function(event) {
event.preventDefault();
var sayc = jQuery('input[name="sayc"]').val()
if (sayc) {
jQuery.get('testing.php?action=consolesay', { sayc_input: sayc} );
jQuery('input[name="sayc"]').attr('value','')
} else {
alert('Please enter some text');
}
});
$('#kick_btn').click(function(event) {
event.preventDefault();
var player_name = jQuery('input[name="player"]').val()
if (player_name) {
jQuery.get('testing.php?action=kick', { player_input: player_name} );
} else {
alert('Please enter some text');
}
});
});
Sample Form
<form id=\"kick_player\" action=\"\">
<input type=\"hidden\" name=\"player\" value=\"$pdata[name]\">
<input type=\"submit\" id=\"kick_btn\" value=\"Kick Player\"></form>
And the handler code
if ($_GET['action'] == 'chatsay') {
$name = USERNAME;
$chatsay = array($_GET['say_input'],$name);
$api->call("broadcastWithName",$chatsay);
die("type: ".$_GET['type']." ".$_GET['say_input']);
}
if ($_GET['action'] == 'consolesay') {
$consolesay = "§4[§f*§4]Broadcast: §f".$_GET['sayc_input'];
$say = array($consolesay);
$api->call("broadcast",$say);
die("type: ".$_GET['type']." ".$_GET['sayc_input']);
}
if ($_GET['action'] == 'kick') {
$kick = "kick ".$_GET['player_input'];
$kickarray = array($kick);
$api->call("runConsoleCommand", $kickarray);
die("type: ".$_GET['type']." ".$_GET['player_input']);
}
When I click the button, it reloads the page for starters, and isn't supposed to, it also isn't processing my handler code. I've been messing with this for what seems like hours and I'm sure it's something stupid.
What I'm trying to do is have a single button (0 visible form fields) fire an event. If I have to have these on a seperate file, I can, but for simplicity I have it all on the same file. The die command to stop rest of file from loading. What could I possibly overlooking?
I added more code.. the chat_btn and console_btn code all work, which kick is setup identically (using a hidden field rather than a text field). I cant place whats wrong on why its not working :(
use return false event.instead of preventDefault and put it at the end of the function
ie.
$(btn).click(function(event){
//code
return false;
});
And you should probably be using json_decode in your php since you are passing json to the php script, that way it will be an array.
Either your callback isn't being invoked at all, or the if condition is causing an error. If it was reaching either branch of the if, it wouldn't be reloading the page since both branches begin with event.prevntDefault().
If you're not seeing any errors in the console, it is likely that the callback isn't being bound at all. Are you using jQuery(document).ready( ... ) to bind your event handlers after the DOM is available for manipulation?
Some notes on style:
If both branches of the if contain identical code, move that code out of the if statement:
for form elements use .val() instead of .attr('value')
don't test against "" when you really want to test truthyness, just test the value:
jQuery(document).ready(function () {
jQuery('#kick_btn').click(function(event) {
event.preventDefault();
var player_name = jQuery('input[name="player"]').val()
if (player_name) {
jQuery.get('testing.php?action=kick', { player_input: player_name} );
} else {
alert('Please enter some text');
}
})
});
I figured out the problem. I have a while loop, and apparently, each btn name and input field name have to be unique even though they are all in thier own tags.
$("#playerList").delegate('[id^="kick_btn"]', "click", function(event) {
// get the current player number from the id of the clicked button
var num = this.id.replace("kick_btn", "");
var player_name = jQuery('input[name="player' + num + '"]').val();
jQuery.get('testing.php?action=kick', {
player_input: player_name
});
jQuery('input[name="player"]').attr('value','')
alert('Successfully kicked ' + player_name + '.');
});