JavaScript - Javascript Inside An Ajax Called Object

Hi

I want to build a site that has these two javascript effects. I know HTML, but dont know javscript too well, I know some to be able to change some aspects.

I have found some code online that allws me to change the background image with each click of the links.

the effect I now want to create is the effect that as you clikc on teh link and the new text appears, the old one drops down andthe new one pops up from the bottom into place. and you have a choice of either a big block ont eh right or a small strip on the bottom depending ont he page.

what is this effect called. and does any one know where i might be able to get soem code for it from so i can insert it into my page

I hope all this makes sense

the site is
http://www.peponi-lamu.com

many thanks

Hi guys,

calling a php page through AJAX. and it works Aok.
I wanted the ajax backend php file to call a function in the front end page.
even a simple alert from the backend php file wont work.
Any help is greatly appreciated.

My code to call the alert and parent's javascript functions are below.

Simple alert
Code:

echo "<script language='javascript'>alert('Please Help Me');</script>";

Calling Front End Page Function
Code:

echo "<script language='javascript'>frontend_function();</script>";

Cheers
Elabuwa

Hello:

I have a bit of an interesting delima:

I have a form with select box which is dynamically db populated and based on the first selection, additional data populates two other linked boxes (a input and a textarea). This process happens in a table row.

here is the source code of the selection process:
PHP Code:
<tr><td><select name='select_1' style='width:200px; color:#003399; text-align:center; font-size:1em' onChange="switch_select(); switch_text();"> 
      <option>-- Select an Item --</option><option>5 A Series Blades</option><option>Balls</option><option>TT Tables-Mini</option><option>Bottle Water</option><option>TT Tables -- Reg</option><option>Gatorate</option><option>Blade combo</option><option>Membership Renewal</option><option>1 hr Private Lesson (Adlt)</option><option>1 hr Private Lesson (Chld)</option><option>Group Lesson (Adlt)</option><option>Group Lesson (Chlidren)</option><option>Membership (Couples-2)</option><option>Membership (Family -Up 4)</option><option>Robot Play</option><option>Gift Certificate</option><option>Gift Card Add Value</option><option>Club T-Shirts</option><option>Member Credit</option><option>Other</option><option>Rubber - 1615 PIPS </option><option>Rubber -Volant 3</option><option>6 A Series Blades</option><option>Blades Only -China QI</option><option>Blades Only -CQ 1</option><option>Ross-Action Blade</option><option>Ross-Classic Blade</option></select> </td>     
     <select name='select_2' onChange="switch_text();" style='display:none' disabled='true'>
    <option>You need to select a category</option>
    <option></option>
    <option></option>
  </select><td><textarea name='mytextarea' rows='2' cols='40' class='expand10-1000' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></textarea><td>
              <td valign='top' width='17%'><input  type='text' name='qty'  class="qty" size='3' maxlength='3' value='' class='combo3' rel='code_id' title='' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></td>
            <td valign='top'  width='17%'><input  type='text' name='cost'  class="cost" size='6' maxlength='6' value='0.00' class='combo3' rel='code_id' title='' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></td>
              </tr> 


The user has the option of adding an additional row which is similarily structured to give the user the option of selecting a different item (with its description an price) for each row.

Now here is the problem; the adding row mechanism is done with ajax using the following code:

PHP Code:
$('#addrow').click(function(){
        $('.item-row:last').after('[COLOR="Red"]//INSERT THE CONTENT OF THE PHP HERE//[/COLOR]');
        if ($('.delete').length > 0) { $('.delete').show(); }
        bind();
    }); 


I want to insert the content of an external php file containing the dynamic linked field into the ajax above in the section outlined in red.

Sorry for the long post...

here is the external php file:

PHP Code:
<?php
echo"
    <script type='text/javascript' src='js/jquery-1.3.2.min.js'></script>
    <script language='JavaScript'> ";?>
var num_of_cats = 17; // This is the number of categories, including the first, blank, category.
var open_in_newwindow=1; //Set 1 to open links in new window, 0 for no.
<?php
include '../datalogin.php';// make sure this is available to make connection to db

$result = mysql_query("SELECT * FROM products");
echo "var option_array = new Array(num_of_cats);";

$count=1;
echo"option_array[0] = new Array(\"Please Select a Merchandise\");";
while($row = mysql_fetch_array($result))
  {
echo"option_array[".$count."] = new Array(\"--select One--\",\"\",\"\");";
$count++;
}
$result2 = mysql_query("SELECT * FROM products");

echo"var text_array = new Array(num_of_cats);";

$count=1;
echo  "text_array[0] = new Array(\"Please Select a Merchandise\");";
while($row_1 = mysql_fetch_array($result2))
  {
echo "text_array[".$count."] = new Array(\"".$row_1['product_desc']."\");";
$count++;

}

$result3 = mysql_query("SELECT * FROM products");

echo "var text_array2 = new Array(num_of_cats);";

$count=1;
echo "text_array2[0] = new Array(\"Please Select a Merchandise\");";
while($row_2 = mysql_fetch_array($result3))
  {
echo "text_array2[".$count."] = new Array(\"".$row_2['unit_cost']."\");";
$count++;

}

?>
<?php
echo"
var options = 0;
function switch_select()

{
  for (loop = window.document.PaymentForm.select_2.options.length-1; loop > 0; loop--)
  {
    window.document.PaymentForm.select_2.options[loop] = null;
  }
  for (loop = 0; loop < option_array[window.document.PaymentForm.select_1.selectedIndex].length; loop++)
  {
    window.document.PaymentForm.select_2.options[loop] = new Option(option_array[window.document.PaymentForm.select_1.selectedIndex][loop]);
  }
    window.document.PaymentForm.select_2.selectedIndex = 0;
}
  
function switch_text()
{
  window.document.PaymentForm.mytextarea.value = text_array[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];
 window.document.PaymentForm.cost.value = text_array2[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];
  //window.document.PaymentForm.gift_card.value = text_array3[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];
  //window.document.PaymentForm.qty.value = text_array4[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];

  }
function box()
{
  if (window.document.PaymentForm.select_2.selectedIndex == 0)
  {
    alert(\"Sorry, you have to select an item\");
  } else {
    if (open_in_newwindow==1)
    window.open(url_array[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex],\"_blank\");
    else
    window.location=url_array[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex]
  }
}
function set_orig()
{
  window.document.PaymentForm.select_1.selectedIndex = 0;
  window.document.PaymentForm.select_2.selectedIndex = 0;
}
window.onload=set_orig
</script> ";
            include '../datalogin.php';
$get_products = "select id as id_num, items as display_name2 from products order by id_num"; 
$get_products_res = mysql_query($get_products) or die (mysql_error()); 

if (mysql_num_rows($get_products_res) < 1) 
  { 
       // no records 
       $display_block .="<p><em>Sorry, no records to select</em></p>"; 
    } 
    
  else 
   { 
    echo" <form name='PaymentForm' onSubmit='return false;'>
    <tr><td><select name='select_1' style='width:200px; color:#003399; text-align:center; font-size:1em' onChange=\"switch_select(); switch_text();\"> 
      <option>-- Select an Item --</option>"; 
 while ($recs2 = mysql_fetch_array($get_products_res)) 
      { 
          $id_num = $recs2['id_num']; 
          $display_name2 = stripslashes($recs2['display_name2']); 
          
 //$display_block .= "<option value=\"$id_num\">$display_name2</option>"; 
 echo "<option>$display_name2</option>"; 

                     } 
      }
  echo "</select> </td>"; 

 echo "     
     <select name='select_2' onChange=\"switch_text();\" style='display:none' disabled='true'>
    <option>You need to select a category</option>
    <option></option>
    <option></option>
  </select>";
              echo"<td><textarea name='mytextarea' rows='2' cols='40' class='expand10-1000' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></textarea><td>
              <td valign='top' width='17%'><input  type='text' name='qty'  class=\"qty\" size='3' maxlength='3' value='' class='combo3' rel='code_id' title='' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></td>
            <td valign='top'  width='17%'><input  type='text' name='cost'  class=\"cost\" size='6' maxlength='6' value='0.00' class='combo3' rel='code_id' title='' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></td>
              </tr>
            </form>";

            ?>

I hope this is doable and that I have describe my intention properly. Any thoughts would be appreciated!

Mossa

Firebug is giving me no error messages, but alert() message is never triggered. I want the alert() message defined below to alert what the value of the variable result is (e.g. {filter: Germany}). And it doesn't. I think the javascript breaks down right when a new Form instance is instantiated because I tried putting an alert in the Form variable and it was never triggered. Note that everything that pertains to this issue occurs when form.calculation() is called:

markup:

Code:

        <fieldset> 
        <select name="filter" alter-data="dropFilter"> 
            <option>Germany</option> 
            <option>Ukraine</option> 
            <option>Estonia</option> 
        </select>    
        <input type="text" alter-data="searchFilter" /> 
    </fieldset>

javascript (below the body tag)
Code:

<script> 
(function($){ 
 
var listview = $('#listview'); 
 
var lists = (function(){ 
    var criteria = { 
        dropFilter: { 
            insert: function(value){ 
                if(value) 
                    return handleFilter("filter", value);   
            }, 
            msg: "Filtering..." 
        }, 
        searchFilter: { 
            insert: function(value){ 
                if(value) 
                    return handleFilter("search", value); 
            }, 
            msg: "Searching..." 
        } 
 
    } 
    var handleFilter = function(key,value){ 
            return {key: value}; 
    } 
    return {   
         create: function(component){ 
            var component = component.href.substring(component.href.lastIndexOf('#') + 1);  
            return component; 
        }, 
         setDefaults: function(component){ 
            var parameter = {}; 
            switch(component){ 
                case "sites": 
                    parameter = { 
                        'order': 'site_num', 
                        'per_page': '20', 
                        'url': 'sites' 
                    } 
            } 
            return parameter; 
        }, 
        getCriteria: function(criterion){ 
            return criteria[criterion];      
 
        }, 
        addCriteria: function(criterion, method){ 
            criteria[criterion] = method;   
        } 
    } 
})();  
 
var Form = function(form){ 
    var fields = []; 
    $(form[0].elements).each(function(){   
        var field = $(this);   
        if(typeof field.attr('alter-data') !== 'undefined') fields.push(new Field(field));   
    })   
} 
 
Form.prototype = { 
    initiate: function(){ 
        for(field in this.fields){ 
            this.fields[field].calculate();  
        } 
    }, 
     isCalculable: function(){   
        for(field in this.fields){   
                if(!this.fields[field].alterData){   
                return false;  
            } 
        }  
        return true;    
    }  
} 
 
var Field = function(field){   
    this.field = field;  
    this.alterData = false;  
    this.attach("change");   
    this.attach("keyup");   
} 
 
Field.prototype = {   
    attach: function(event){ 
        var obj = this;   
        if(event == "change"){ 
            obj.field.bind("change", function(){  
                return obj.calculate(); 
            }) 
        } 
        if(event == "keyup"){ 
            obj.field.bind("keyup", function(e){   
                return obj.calculate(); 
            }) 
        } 
    }, 
    calculate: function(){ 
        var obj = this,   
            field = obj.field,   
            msgClass = "msgClass", 
            msgList = $(document.createElement("ul")).addClass("msgClass"),   
            types = field.attr("alter-data").split(" "),   
            container = field.parent(),  
            messages = []; 
 
        field.next(".msgClass").remove();  
        for(var type in types){   
            var criterion = lists.getCriteria(types[type]);   
            if(field.val()){  
                var result = criterion.insert(field.val());  
 
                container.addClass("waitingMsg");   
                messages.push(criterion.msg);   
 
                obj.alterData = true;   
 
                alert(result); 
                initializeTable(result);   
 
            } 
            else {    
                return false;   
                obj.alterData = false;   
            } 
        } 
        if(messages.length){ 
            for(msg in messages){ 
                msgList.append("<li>" + messages[msg] + "</li");   
            } 
        } 
        else{ 
            msgList.remove();   
        } 
    } 
} 
 
$('#dashboard a').click(function(){ 
    var currentComponent = lists.create(this); 
    var custom = lists.setDefaults(currentComponent); 
    initializeTable(custom); 
}); 
 
var initializeTable = function(custom){ 
    var defaults = {}; 
    var custom = custom || {}; 
 
    var query_string = $.extend(defaults, custom); 
 
    var params = []; 
    $.each(query_string, function(key,value){ 
        params += key + ': ' + value;  
    }) 
    var url = custom['url']; 
 
    $.ajax({ 
        type: 'GET', 
        url: '/' + url, 
        data: params, 
        dataType: 'html', 
        error: function(){}, 
        beforeSend: function(){}, 
        complete: function() {}, 
        success: function(response) {  
            listview.html(response); 
        } 
    }) 
} 
 
$.extend($.fn, {   
    calculation: function(){ 
 
        var formReady = new Form($(this)); 
 
        if(formReady.isCalculable) { 
            formReady.initiate();    
        } 
    } 
 
}) 
 
 
    var form = $('fieldset'); 
    form.calculation(); 
})(jQuery)

Thanks for response.

I have created this svg color picker :

Edit fiddle - JSFiddle

I want that each color can be clicked and if each of them clicked, it will rotate the selected image to the top while the rest of the color will be moved accordingly clockwise (like a wheel).

Here is the structure I am working with as this html/script was created by the chmProcessor to produce WebHelp files...

index.htm contains:
Code:

<iframe id="mainFrame" name="mainFrame" class="full" src=
"frameset.html">

frameset.html contains:
Code:

<frameset cols="20%,80%">
<frame id="treeFrame" src="tree.html" name="treeFrame" />
<frame id="frameCont" src="2_Welcome.htm" name="Welcome" />
</frameset>

tree.html is the navigational panel and contains:
Code:

<script type="text/javascript" src="tree.js">
</script>

I have placed alert() calls in tree.js. When I load index.htm in Chrome, apparently tree.js is not being loaded because I do not see any alert box and the functionality within tree.js does not work.

Note: The functionality does work in IE and Firefox

If I open tree.html directly in Chrome, the tree.js functionality does get called.

I do not know how to solve this problem or why Chrome is not loading the pages and script correctly. Thanks for your help!

Here's my object constuctor:
Code:

function suggest_object(result_id)
{
	this.in_result_div = false;

	this.search_element = document.getElementById(result_id);
}

And the execution code:
Code:

var suggest = new suggest_object(result_id);

document.getElementById(result_id).onmouseover = function(){suggest.in_result_div = true;}

It works as is, but i'd really like to be able to set the onmouseover inside of the object. Something like

Code:

function suggest_object(result_id)
{
	this.in_result_div = false;

	this.search_element = document.getElementById(result_id);

	this.input_element.onmouseover = function()
	{
		this.in_result_div = true;
	}
}

So how can I get the 'this' inside the onmouseover function to refer to the object?

0 down vote favorite

I have been struggling with this for some time.. I searched around but didnt get a solution yet. This is only an issue on production server. In my development environment, everything works just fine.

I am using JQuery/Ajax to update product information based on product's Color attribute. for example, a product has A and B color, the price for color A is different from color B. When user choose different color, the price information is updated as well.

What I did is to first add a javascript function: function updateProductVariant() { var myval = jQuery("#<%=colorDropDownList.ClientID%>").val();

jQuery.ajax({
type: "POST",
url: "/Products.aspx/GetVariantInfoById",
data: "{variantId:'" + myval + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",

success: function (response) {
var obj = jQuery.parseJSON(response.d);

jQuery("#<%=lblStockAvailablity.ClientID%>").text(obj.StockMessage);
jQuery(".price .productPrice").text(obj.CurrentPrice);
jQuery(".price .oldProductPrice").text(obj.OldPrice);
}

});
}

Then I can register the dropdown list's 'onclick' event point to function 'updateProductVariant'

GetVariantInfoById is a Web method in the codebehind, its also very straightforward： [WebMethod] public static string GetVariantInfoById(string variantId) {

int id = Convert.ToInt32(variantId);

ProductVariant productVariant = IoC.Resolve<IProductService>().GetProductVariantById(id);

string stockMessage = productVariant.FormatStockMessage();

StringBuilder oBuilder = new StringBuilder();

oBuilder.Append("{");
oBuilder.AppendFormat(@"""{0}"":""{1}"",", "StockMessage", stockMessage);
oBuilder.AppendFormat(@"""{0}"":""{1}"",", "OldPrice", PriceHelper.FormatPrice(productVariant.OldPrice));
oBuilder.AppendFormat(@"""{0}"":""{1}""", "CurrentPrice", PriceHelper.FormatPrice(productVariant.Price));
oBuilder.Append("}");
return oBuilder.ToString();
}

All these works fine on my local box, but if i upload to the production server, catching the traffic using fiddler, /Products.aspx/GetVariantInfoById becomes a 302 Object moved
Object moved to here.

On my local box,

HTTP/1.1 200 OK

Server: ASP.NET Development Server/10.0.0.0

Date: Thu, 03 Mar 2011 09:00:08 GMT

X-AspNet-Version: 4.0.30319

Cache-Control: private, max-age=0 Content-Type: application/json; charset=utf-8 Content-Length: 117 Connection: Close

But when deployed on the host, it becomes HTTP/1.1 302 Found

Proxy-Connection: Keep-Alive

Connection: Keep-Alive

Content-Length: 186

Via: 1.1 ADV-TMG-01

Date: Thu, 03 Mar 2011 08:59:12 GMT

Location: http://www.pocomaru.com/Products.asp...d/default.aspx

Server: Microsoft-IIS/7.0 X-Powered-By: ASP.NET

then of course, then it returns 500 error title>Unknown web method GetVariantInfoById/default.aspx.
Parameter name: methodName

Can someone please take a look? I think its some configuration in the production server which automatically redirects my webservice call to some other URL, but since the product server is out of my control, i am seeking a local fix for this. Thanks for the help!

I'm writing a web app and so far:

- the user enters some information on the web page
- user data is submitted to a PHP script (using AJAX, so w/o a page refresh) which processes the data and generates a list of items that need to be returned to the user

Now, I need to return the data -- preferably in the form of a list, where each returned item has a check box (so the user can choose which items in this list the subsequent operations will affect).

However, can a PHP script effectively add/remove contents from such a checklist, or would this be something done better through Javascript only? For example: this, I think, or something similar.

Luckily the PHP script that processes the data is short at this point, so I'd like to know whether I should rewrite it in Javascript (assuming Javascript can deal with REST well) to avoid a hassle.

All,
I have some code on my page which changes images in a div without reloading the page. This works great, however my problem comes with I go through a couple images and the actual URL is still on the original image. Is there any way to change the URL when I click the image as well??

Thanks in advance.

I have to display a div before firing a sync ajax in javascript
div is getting displayed in firefox but not in IE and chrome.

I need to basically display a download bar to indicate the user that the request is in progress

Someone built this application for me. It contained a web page, the user clicked on the detail button to view a detail page, and then clicked on an update button on the detail page to update the database. This type of navigation was unappealing to me. I prefer a free floating form that contains a list, then by clicking on expand, you get to see detail on the specific item, and then click update all within the same free floating form. Is this possible with javascript and ajax? If so, can anyone provide examples? Thanks.

Hello,

I am using AJAX and got the output from AJAX like the below line

Ajax function

Code:

if (http_request.readyState == 4) {
    if (http_request.status == 200) {
            var_output = http_request.responseText;
            document.getElementById('result').innerHTML = var_output;  //value 100 displayed
}
else
{
           alert('There was a problem with the request.');
}
}

In my javascript function, i need to get the value 100 from that innerHTML.
Is it possible to get this value?

Code:

// I tried this way, but not working
var txt = document.getElementById('result').innerHTML;

or Store it in hidden field and get the value from javascript.

Please suggest any idea to solve this problem

Thanks

Hi, I'm trying to work through a head first book on ajax and javascript. I am also trying to emplement some of the codes in a small application I had built strictly with server side code.

What it does is: two input fields for user defined values. Once the user inputs the two values, they are passed to the action page, some simple math is performed on these 2 values, and then 4 different resluts are displayed back on the action page. What I wanted was of course to make this asynchronous and display the results without a page reload.

So, when I reworked the book code for my own use, and try to run the application, I get an error saying my url variable is undefined. The value of the first input seems to be passed though.

One thing of note to mention is the application was written in coldfusion. The form values are passed using cf. Not sure if that matters. I mean cf works well with js and ajax, but maybe my original procedure doesnt work with my js code as it is now.

Here is the javascript/ajax code:
PHP Code:
<script type="text/javascript" language="javascript">
var request = null;

      try {
          request = new XMLHttpRequest();
      }   catch (trymicrosoft) {
          try {
              request = new ActiveXObject("Msxm12.XMLHTTP");
          } catch (othermicrosoft) {
              try {
                  request = new ActiveXObject("Microsoft.XMLHTTP");
              }   catch (failed) {
                  request = null;
          }
      }

  if(request == null)
  alert("Error creating request object!");
  }
  
  function getLampVolts() 
  {
      var lamp = document.getElementById("lampVoltage").value;
      var url = "calculatorAction.cfm?lamp = " + escape(lampVolts);
      request.open("GET", url, true);
      request.onreadystatechange = updatePage;
      request.send(null);
  }
  function updatePage()
  {
    if(request.readyState == 4)
    {
        if(request.status == 200)
        {
            
        var lumens = request.responseText;
        document.getElementById("lumens").value =
        lumens;
        }
        else
         alert("Error! Request Status is " + request.status);
    }
  }
</script> 


Here is the form:
Code:

<form action="calculatorAction.cfm">
  <table>
    <tr>
      <th>Lamp Voltage</th>
      <td><input name="lampVoltage" id="lampVoltage" type="text" /></td>
    </tr>
    <tr>
      <th>Socket Voltage</th>
      <td><input name="socketVoltage" id="socketVoltage" type="text" /></td>
    </tr>
    <tr>    
      <td><input type="button" value="Submit" onClick="getLampVolts();" /></td>
      <td><input type="reset" value="Reset" /></td>
    </tr>
  </table>

and here is my action page calculatorAction.cfm:
Code:

<cfparam name="bulbCalculator.cfm" type="any" default="0">
<!--- Set User Defined Values of Form --->
<cfset lampVolts = FORM.lampVoltage>
<cfset actualVolts = FORM.socketVoltage>
<!--- Set Constants For Calculations --->
<cfset lumens = 27500>
<cfset life = 500>
<cfset watts = 65>
<cfset colorTemp = 3500>
<!--- Perform Calculations --->
<cfset actualLumens = ((actualVolts/lampVolts)^3.4)*lumens>
<cfset lumenPercent = actualLumens/lumens*100>
<cfset hours = ((lampVolts/actualVolts)^13)*life>
<cfset hourPercent = hours/life*100>
<cfset actualWatts = ((actualVolts/lampVolts)^1.3)*watts>
<cfset wattPercent = actualWatts/watts*100>
<cfset temperature = ((actualVolts/lampVolts)^.42)*colorTemp>
<cfset tempReduction = temperature-colorTemp>

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<cfsavecontent variable="calculations">
<table>
  <cfoutput>
    <tr>
      <td>Lamp Rated Voltage:</td>
      <td>#lampVolts#</td>
    </tr>
    <tr>
      <td>Socket Application Voltage:</td>
      <td>#actualVolts#</td>
    </tr>
    <tr>
      <td id="lumens">Percent of Lumens Used:</td>
      <td>#round(lumenPercent)#%</td>
    </tr>
    <tr>
      <td>New Rated life in Percentages:</td>
      <td>#round(hourPercent)#%</td>
    </tr>
    <tr>
      <td>Percent of Watts Used:</td>
      <td>#round(wattPercent)#%</td>
    </tr>
    <tr>
      <td>Change in Temperatu </td>
      <td>#round(tempReduction)#&deg;</td>
    </tr>
  </cfoutput>
</table></cfsavecontent>
</body>
</html>

Again, the url variable says it is undefined. But the variable "lamp" contains the form field value.

Thanks for any help and tips in advance!

hi friends,

I am looking for a solution to display the records of a dynamically selected mysql table using ajax,jsp & js combinations.

any sites showing some example

thnx in advance.