I ran across a strange situation that I am wondering if anyone has encountered.
I have a screen where the user is selecting a company name from a SELECT tag. When they do, a piece of javascript calls an ajax routine to fill in a DIV with the company's information. The ajax script is just plain PHP that accesses a database, pulls up the company record and echos the data to the screen.
All very straight forward and all working fine. I can keep selecting different companies from the SELECT tag, and the new info gets filled in, as expected.
Then, I went into the ajax code and added some more error checking. If an error is found, I put a message on the screen using an alert box. I do this by putting the message in a $msg variable, and then echoing out a small piece of javascript that uses alert to display the message. Looks like this:
$msg = "Something went wrong";
echo "<script type='text/javascript'>alert('$msg');</script>";
I use this method in lots of places, and I've never noticed a problem with it before (but I guess that doesn't mean there wasn't one!!).
I just noticed that as soon as I do this, my SELECT stops working. When I click on the tag, the selection box does not open, and I cannot select a different item until I leave the page and come back, or refresh the page.
As long as I don't generate an ALERT message, everything works fine. I have checked to make sure that there are no duplicate ID's names anywhere, and have run out of ideas.
Thanks for any help or direction!
An ALERT stops SELECT tag from working
Moderator: General Moderators
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
- JAB Creations
- DevNet Resident
- Posts: 2341
- Joined: Thu Jan 13, 2005 6:44 pm
- Location: Sarasota Florida
- Contact:
Re: An ALERT stops SELECT tag from working
PHP defines variables this way...
JavaScript defines variables this way...
Be sure to always use var when first defining a variable, however you do not need to use it a second time once it's already define (be it in a function or not).
Code: Select all
$example = 'stuff';Code: Select all
var example = 'stuff';Re: An ALERT stops SELECT tag from working
I'm not sure what you are trying to explain, but ...JAB Creations wrote:PHP defines variables this way...
JavaScript defines variables this way...Code: Select all
$example = 'stuff';
Be sure to always use var when first defining a variable, however you do not need to use it a second time once it's already define (be it in a function or not).Code: Select all
var example = 'stuff';
Both lines will work in JS. The $ symbol is a valid JS variable name symbol (jQuery
AFAIR, in JS declaring a variable by using the var declaration makes it a global one while a variable without var declaration exists only in the current scope.
There are 10 types of people in this world, those who understand binary and those who don't
Re: An ALERT stops SELECT tag from working (a FireFox problem!)
I apologize for not posting code the first time. I was just trying to see if anyone had run into a similar situation. Apparantly not.
In the process of distilling out a snippet that demonstrates the problem, it occurred to me to test using different browsers. And I have discovered that while I am able to reliably reproduce the problem with a small piece of code, it is only a problem in FireFox (where I do most of my testing so I can use FireBug). I updated to the latest version, and the problem persists.
I will try to report the problem to Mozilla. Have never had much luck doing that sort of thing, but will give it a solid attempt.
If anyone is still interested in seeing the code, here it is.
This first piece is the basic HTML that creates the SELECT tag, creates the DIV for ajax to fill, and contains the JavaScript to call the AJAX script whenever the SELECT changes.
Here is the AJAX script that either fills the DIV or pops up the alert box:
Of course, knowing that it exclusively a FireFox problem makes it much less interesting (although still annoying).
In the process of distilling out a snippet that demonstrates the problem, it occurred to me to test using different browsers. And I have discovered that while I am able to reliably reproduce the problem with a small piece of code, it is only a problem in FireFox (where I do most of my testing so I can use FireBug). I updated to the latest version, and the problem persists.
I will try to report the problem to Mozilla. Have never had much luck doing that sort of thing, but will give it a solid attempt.
If anyone is still interested in seeing the code, here it is.
This first piece is the basic HTML that creates the SELECT tag, creates the DIV for ajax to fill, and contains the JavaScript to call the AJAX script whenever the SELECT changes.
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type='text/javascript' src='javascript/jquery-1.3.2.min.js'></script>
</head>
<body>
Select an option:
<select id='selection'>
<option value=1>Hello 1</option>
<option value=2>Hello 2</option>
<option value=3>Hello 3</option>
<option value=4>Hello 4</option>
<option value=5>Hello 5</option>
</select>
<div id='ajaxWillFillThis'></div>
<script type="text/javascript">
$("#selection").change
(
function()
{
var selected = $(this).val();
$("#ajaxWillFillThis").load('ajax_FillThis.php?selected=' + selected);
}
);
</script>
</body>
</html>
Code: Select all
<?php
$id = $_GET['selected'];
if ($id < 5)
{
echo "You selected option number: $id";
}
else
{
$msg = "Sorry - you selected option number $id";
echo "<script type='text/javascript'>alert('$msg');</script>";
}
?>