Hello Fellow Developers,

I am using the awesome drag and drop script found at http://script.aculo.us/. I have also added a modification that interacts to a db for reordering upon release of a dragable item. Within each dragable is a input checkbox. This checkbox holds a DB id value that is sent on submit. This process works fine in IE, but in FF the checkbox values dont get sent via GET, or POST. How do i get FF to react as i think it should, and IE does. Heres a little bit of code from the project beyond the standard script.aculo.us library. Thanks,

Interface Script

<?php /*   needed for IE   */ ?>
<div id="page">
    <div id="sale_row" class="section">
        <div id="item_1" class="lineitem" style="cursor: move;">example 1 <input type="checkbox" name="check_value[]" value="example1"></div>
        <div id="item_2" class="lineitem" style="cursor: move;">example 2 <input type="checkbox" name="check_value[]" value="example2"></div>
    </div>
</div>

<?php /*   set JS outside *page* div   */ ?>
<script type="text/javascript">
    // <![CDATA[
    sections = ['sale_row'];

    <?php /*   this watches for event changes like drag and drop action   */ ?>
    Event.observe(window,'load',init,false);
    function init() {

        <?php /*   add a sortable.create for each group level div   */ ?>
        Sortable.create('sale_row',{tag:'div', dropOnEmpty:true, containment:sections, only:'lineitem', onUpdate:updateData});
    }

    Sortable.create('page',{tag:'div',only:'section',handle:'handle'});
    // ]]>
</script>

*Javasript* that formats and sends url to ajax db update page. When chekbox vars "params" are sent this works perfectly.

function updateData() {
    var params = '';
    var sections = document.getElementsByClassName('section');
    sections.each(function(section) {
        params = Sortable.serialize(section.id);
        var ajax = new Ajax.Request(page_url,{
            method: 'post',
            parameters: params
        });
    });
}

Looks like you are actually posting the params using the "method: 'post'" The problem might be with the JavaScript triggering this event, "onUpdate". Im not sure if this is supported in FF or not. I've had this issue with some AJAX apps myself using onChange.

At first view, I don't see any problems with your code.


You might want to check it with the firebug extention (www.getfirebug.com) to check if the xmlHttp call is ok, returns anything and how the parameters are formed.
Your problem might be there...

thanks for the suggestions.

yes the code seems fine to me as well. it was suggested

it's simply because gecko and IE have different methods for accessing the values of checkbox objects, use a different input type, like a normal hidden text input, or alternatively write something in to detect which browser you are being visited with and use the appropriate method.......

i do though, not understand, how to use a hidden input instead of a check box. How does the use select the hidden fields to send via POST?

You might want to check it with the firebug extention (www.getfirebug.com) to check if the xmlHttp call is ok, returns anything and how the parameters are formed.

I have firebug, but have not used it much. Can you please explain where i see if the xmlHttp call is ok?

Originally Posted by empiresolutions

I have firebug, but have not used it much. Can you please explain where i see if the xmlHttp call is ok?

On the page, press the F12 key, it will bring up the firebug console.
Select the "console" tag, under the bug, and check in the option menu (on the far right) that the "Show XmlHttpRequests" is checked.

Now, for every request sent to a server, you can see the url called, the parameters sent, and the reply sent by the server.

One other very useful function is the "inspect" button, uppon the console.
It allows you the view the generated HTML under the mouse cursor, but every CSS classes applied to tis element as well.

Give it a try, you will not be able to work without it later.

I've found this from the getfirebug documentation page.
It gives you a more in depth preview
http://encytemedia.com/blog/articles...g-with-firebug

There doesn't seem to be any problems with your code in particular maybe there are problems with you using FF with your program just something to think about. But it should get you to the bottom of this problem.

Something wrong with Firefox!!!! Never.... anyways, the code is good i believe. I am trying out suggestions found here, http://www.webdeveloper.com/forum/sh...077#post742077, and will be posting my results in a few hours hopefully.