Topic: Xajax Bugs with IE?

Any reason why this piece of code may not work in IE, but it does in FF? (every other part of the xajax code not shown does work) The problem is when onclick is fired, it does not display the <tr></tr> below for the item clicked. Is Append the correct call for the xajax?.. I want the user to be able to continue clicking on a select box value and the cooresponding results continuing to populate below in a nested table.
I'll spend some time debugging it, but wanted to see if there was something glaring in my code to make it fail in IE.

btw, what is the difference between addAppend and Append?

function store_upscode_onchange($form_values)
    {
        $objResponse = new xajaxResponse();
       
        $storename_name = $form_values['storename_name'];
        $store_number = $form_values['store_number'];
        $store_id = $form_values['store_id'];
       
        if ($store_id != '0')
        {
           
            //$this->insert_store($store_id); // Insert store entry line into contracts table
           
            $line_entry = $this->build_line_entry($store_id, $storename_name, $store_number);
           
            $objResponse->Append("txt_result", "innerHTML", $line_entry);
        }
        else
        {
            $objResponse->Assign("txt_result", "innerHTML", "");
        }

        return $objResponse;
    }

function build_line_entry($id, $name, $number)
    {
        $line = "<tr><td class='padded_td'>" . $number. "</td><td class='padded_td'>" . $name . "</td><td class='padded_td'>" . $id . "</td></tr>";
       
        return $line;
    }

Here is my VIEW
<form name="form_stores" id="form_stores" method="post" action="/dropdownlist/postback">
    <table class="content_table">
        <tr>
            <td><?=$storename_name_dropdownlist?></td>
            <td><div id="div_store_number"><?=$div_store_number?></div></td>
            <td><div id="div_store_upscode"><?=$div_store_upscode?></div></td>
        </tr>
        <tr>
            <td class="table_footer">Store Name</td>
            <td class="table_footer">Store Number</td>
            <td class="table_footer">UPS Code</td>
        </tr>
        <tr>
            <td colspan="3" class="empty"></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td class="right"><input id="saveForm" class="btTxt submit" type="submit" value="Add" /></td>
        </tr>
        <tr>
            <td colspan="3" class="empty"></td>
        </tr>
        <tr>
            <td colspan="3">
                <table class="content_table" id="txt_result"></table>
            </td>
        </tr>
    </table>
</form>

Re: Xajax Bugs with IE?

Here's the <select> onchange piece of the code:

function build_store_upscode_dropdownlist($store_number, $storename_name, $store_upscode)
    {
       
        $query = $this->store->getStorebyNumberName($store_number, 'store_upscode', $storename_name);

        $output = "<select id='store_id' name='store_id' size='8' onchange='xajax_store_upscode_onchange(xajax.getFormValues(form_stores));'>";

        if ($output)
        {
            foreach ($query as $row)
            {
                $output .= $this->new_option($row['store_upscode'], $row['store_id'], $store_upscode);
            }
          }
       
        $output .= "</select'>";

        return $output;
       
    }

Re: Xajax Bugs with IE?

For whatever reason, the W3C deemed it "incorrect" to write to the innerHTML of a TABLE, TBODY or TR (among other tags), so the only way to accomplish this is to use the DOM calls:

$objResponse->create  // to create the table row
$objResponse->create  // to create each of the table cells

and then:

$objResponse->assign  // to populate the table cells with data  (assign to the innerHTML)

It is a hassle, but works well, once your code is structured to handle it.

Now, the odd thing is that IE is one of the only browsers that currently FOLLOWS the standard (with regard to this issue)!  Go figure.

// Joe

xajax Developer
Connect to me on LinkedIn:
http://www.linkedin.com/in/calledtoconstruct

Re: Xajax Bugs with IE?

CtC.. would this be correct?

$objResponse->Create("parent_table", "tr_name", "tr_id", "tr");
$objResponse->Create("parent_table", "td_name", "td_id", "td");

// the above will produce?:
//<tr name="tr_name" id="tr_id">
//<td name="td_name" id="td_id">

$objResponse->Assign("td_name", "innerHTML", $myData);

My .html would begin as
<table name="parent_table" id="parent_table">

</table>



Do I need to run any other command after the ->Create to actually produce the <tr> and <td>?
How do I close my created <tr> and <td>?

I couldn't find any sort of documented usage of the ->Create command to use as a demo go-by.
I just want to dynamically add rows to a table as the users clicks the "Add" button so they can see all the items they've selected dynamically below the selection fields.

Re: Xajax Bugs with IE?

You are close, try this:

Code: PHP

$objResponse->Create("parent_table", "tr", "row_{$number}");

$objResponse->Create("row_{$number}", "td", "row_{$number}_store_number");

$objResponse->Create("row_{$number}", "td", "row_{$number}_store_name");

$objResponse->Create("row_{$number}", "td", "row_{$number}_store_id");



$next_number = $number + 1;



$objResponse->Assign("row_{$number}_store_number", "innerHTML", $store_number);

$objResponse->Assign("row_{$number}_store_name", "innerHTML", $store_name);

$objResponse->Assign("row_{$number}_store_id", "innerHTML", $store_id);



$objResponse->Assign("next_number", "value", $next_number);

 

You'll need to add a HIDDEN tag to your page with the ID "next_number" so you can keep track of how many rows have been added (to give each row a unique set of ID values).  Then, when you make the xajax call, pass this number back to the server.

Let us know how it goes! smile

// Joe

xajax Developer
Connect to me on LinkedIn:
http://www.linkedin.com/in/calledtoconstruct

Re: Xajax Bugs with IE?

I played around with it and am still working to get it right. Because we're still using innerHTML inside the parent table, wouldnt this still be in violation of the w3c that you mentioned?

I did manage to find someone elses code using the ->create so that will help me figure it out.

Re: Xajax Bugs with IE?

The W3C standard restricts writes to the innerHTML on elements such as TABLE, TR, SELECT, but allows writes to innerHTML on the TD element, so the above mentioned code should work.

// Joe

xajax Developer
Connect to me on LinkedIn:
http://www.linkedin.com/in/calledtoconstruct