DataTables logo DataTables

via Ad Packs
Datatables , jeditable and jquery timepicker in Zend Framework ,fnupdate unable to update old value
  • Hi Allan

    I have written a code to integrate timepicker with editable which is being used to make all coulmns except the hidden id coulmn and the first shown coulmn editable . I couldn't get the fnupdate make my edited coulmn to be updated to the new value when it is posted to server side . I am able to get the posted values for server side processing but the clientside is not gettting updated by fnupdate .

    Please see the code below and try to tell me what i am doing wrong because i am having many pages which function the same way .

    Thankyou in Advance

    <script>
    
        $(document).ready(function() {
    
            oTable = $('#scheduleTable').dataTable(
            {
                "sDom"          : '<"top"flip>rt<"bottom"<"clear">',
                "bAutoWidth"    : false,
                "bProcessing"   : true,
                bJQueryUI:true,
                "bServerSide": true,
                "bFilter":false,
                "bSort": false,
                "bInfo": false,
                "bPaginate":false,
                "aoColumns":[
                    {
                        "bVisible" : false
                    },
                    {
                    },
                    {},
                    {},
                    {},
                    {}
                ],
                "fnRowCallback" : function (nRow, aData, iDisplayIndex) {
                    $(nRow).attr('id', '' + aData[0]);
                    //i starting from one to make the first element in td non editable
                    for (i = 1; i < aData.length; i ++) {
                        $('td:eq(' + i + ') ', nRow).editable("<?= $aupdateUrl; ?>", {
                            'callback': function (sValue, y) {
                                var aPos = oTable.fnGetPosition(this);
                                oTable.fnUpdate(sValue, aPos[0], aPos[1]);
    
                            },
                            "submitdata": function ( value, settings ) {
                                return {
                                    "row_id": this.parentNode.getAttribute('id'),
                                    "column": oTable.fnGetPosition( this )[2]
                                };
                            },
                            'height': '14px',
                            indicator : 'Saving...',
                            tooltip : 'Doubleclick to edit...',
                            type       : "timepicker",
                            placeholder : '&nbsp;'
                        });
                    }
    
                    return nRow;
                },
    
                "sAjaxSource"   : "<?= $aSourceList; ?>/startdate/<?= $this->startdate; ?>"
            }
        );
        });
        $('.ui-datepicker-close').live('click', function (e){
            e.preventDefault();
            $('#scheduleTable tbody td input').parents("form").submit();
        });
    
    $.editable.addInputType('timepicker',{
            /*create input element*/
            element:function(settings,orginal){
                var form = $(this),
                input = $('<input type="text">');
                form.append(input);
                return (input);
            },
    
            plugin:function(settings,original){
    
                /*Don't cancel inline editing onblur to allow clicking datepicker*/
                settings.onblur = 'nothing';
                $("input",this).filter(":text").timepicker(
                {   timeFormat: 'hh:mm',
                    'hourMin':6,
                    'hourMax':21,
                    'showSecond': false,
                    'hourGrid':2,
                    'minuteGrid':10
    
                }
            );
            }
        });
    </script>
    
  • 1 Comment sorted by
  • Sorry again i have to make clear that i am getting the above code on ajax request as a response and then insert it in the same page where jquery datepicker exists .

    I love datatables so far i have a working server side zend action helper any one can use to integrate if necessary i will share it . I need help with this one .

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Support

Get useful and friendly help straight from the source.

In this Discussion