Hi i was working with this example http://www.jeasyui.com/forum/index.php?topic=3902.msg9291#msg9291 to create dynamic menu, it works fine  but i need the next customizations.

It's the code for create menu:

Code:

<div id="menu">
            <div id="menu_sistema"></div> <!-- ID for menu_container -->
            <?php include('../menu.php'); ?>
        </div>

Code:

 $.ajax({
        type: "POST",
        datatype: "json",
        async: false,        
        url: ruta_getroles,
        cache: false,
        success: function (jsondata)
        {
            //El método JSON.parse() analiza una cadena de texto como JSON,convert a JSON text into a JavaScript object:            
            menu_data = JSON.parse(jsondata);
            createMenuBar(menu_data, '#menu_sistema'); //LLama a a funcion que construye el menu
        },
        error: function (xhr, ajaxOptions, thrownError) { //si hubo error en la ejecucion                       
            var mensaje = 'Ocurrio un error inesperado, por favor contacte al administrador. Disculpe las molestias.';
            $.messager.alert('Sistema de SOLPEDS y Pedidos', mensaje, 'error');
            alert(xhr.status);
            alert(thrownError);
        }
    });

Code:

function createMenuBar(data, container) {
    $.map(data, function (btn) {
        var b = $('<a href="javascript:void(0)"></a>').appendTo(container);
        if (btn.items) {
            b.menubutton($.extend({}, btn, {
                menu: createMenu(btn.items)
            }));
        } else {
            b.linkbutton($.extend({}, btn, {
                plain: true
                //noline: true
            }));
        }
    });
    function createMenu(items) {
        var m = $('<div></div>').appendTo('body').menu();
        _create(items);
        return m;

        function _create(items, p) {
            $.map(items, function (item) {
                m.menu('appendItem', $.extend({}, item, {
                    parent: (p ? p.target : null)
                }));
                if (item.items) {
                    var p1 = m.menu('findItem', item.text);
                    _create(item.items, p1);
                }
            });
        }
    }
}

My question is How to hide the iconCls, i don't need it !! and how to customize the size of menu and submenus?

Thanks in advance

Thanks it works fine!!!

[How to check if it dialog exists?,]

Hi partners have a nice day, i have one div to show one dialog  it is created fine when is called for first time, but when is called in subsecuent times one error appear .

My question is  How to check if it dialog exists?, if it exists only must be showed and not created .

Code:

<div id="dialog_cambiaPassword"></div>

My function for create the dialog is it:

Code:

function openDialog() {
    
    //var dialog_pass = $("#dialog_cambiaPassword");
    
       var dlg =  $('#dialog_cambiaPassword').dialog({
            title: 'AgendaNet',
            width: 400,
            height: 200,
            closed: true,
            resizable: false,
            href: 'cambiaPassword.html',
            modal: true,
            buttons: [
                {
                    iconCls: 'icon-save',
                    text: 'Grabar',
                    handler: function () {
                        alert('save');
                    }
                },
                {
                    iconCls: 'icon-cancel',
                    text: 'Cancelar',
                    handler: function () {
                        //$('#dialog_cambiaPassword').dialog('close');
                        //$('#dialog_cambiaPassword').dialog('destroy');
                         dlg.dialog('destroy')
                    }
                }
            ]
        });
         $('#dialog_cambiaPassword').dialog('open');
}

Code:

<th field="fecha_recep_doc"  width="120"  align="center"  editor="{type:'datetimebox',options:{editable:true,readonly:false,currentText:'Hoy',closeText:'Cerrar',okText:'Aceptar',showSeconds:false}}" >Recepcion Docum.</th>

Use this extend for example:

Code:

//Extension del datetimebox para ser agregado al DataGrid
$.extend($.fn.datagrid.defaults.editors, {
    datetimebox: {
        init: function (container, options) {
            var input = $('<input>').appendTo(container);
            input.datetimebox(options);
            return input;
        },
        destroy: function (target) {
            $(target).datetimebox('destroy');
        },
        getValue: function (target) {
            return $(target).datetimebox('getValue');
        },
        setValue: function (target, value) {
            $(target).datetimebox('setValue', String(value));
        },
        resize: function (target, width) {
            $(target).datetimebox('resize', width);
        }
    }
})

Code:

$.extend($.fn.datetimebox.defaults, {
    formatter: function (date) {
        //Fecha       
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        var d = date.getDate();
        //Hora
        var h = date.getHours();
        var M = date.getMinutes();
        var s = date.getSeconds();
        var ampm = h >= 12 ? 'PM' : 'AM';
        /*
         h = h > 12 ? h - 12 : h;
         h = h % 12;
         h = h ? h : 12;
         */
        function formatNumber(value) {
            return (value < 10 ? '0' : '') + value;
        }
        var separator = $(this).datetimebox('spinner').timespinner('options').separator;
        //Construye la cadena para el formateo de la fecha, se elimina el formateo de fecha default
        var r = $.fn.datebox.defaults.formatter(date) + ' ' + formatNumber(h) + separator + formatNumber(M);
        if ($(this).datetimebox('options').showSeconds) {
            r += separator + formatNumber(s);
        }
        //r += ' ' + ampm;        
        return r;
    },
    parser: function (s) {
        if ($.trim(s) == '') {
            return new Date();
        }
        var dt = s.split(' ');
        var d = $.fn.datebox.defaults.parser(dt[0]);
        if (dt.length < 2) {
            return d;
        }
        var separator = $(this).datetimebox('spinner').timespinner('options').separator;
        var tt = dt[1].split(separator);
        var hour = parseInt(tt[0], 10) || 0;
        var minute = parseInt(tt[1], 10) || 0;
        var second = parseInt(tt[2], 10) || 0;
        var ampm = dt[2];
        if (ampm == 'pm') {
            hour += 12;
        }
        return new Date(d.getFullYear(), d.getMonth(), d.getDate(), hour, minute, second);
    }
});

[I need some validatebox to check lenght, and content .]

Hi friends, i was searching some solution to create Custom Messager with two input box for change password, my code is it, but i don´t need some simple input box  .

I need some validatebox to check lenght, and content .

Code:

(function ($) {
    function createWindow(title, content, buttons) {
        var win = $("<div class=\"messager-body\"></div>").appendTo("body");
        win.append(content);
        if (buttons) {
            var tb = $("<div class=\"messager-button\"></div>").appendTo(win);
            for (var btn in buttons) {
                $("<a></a>").attr("href", "javascript:void(0)").text(btn).css("margin-left", 10).bind("click", eval(buttons[btn])).appendTo(tb).linkbutton();
            }
        }
        win.window({
            title: title,
            noheader: (title ? false : true),
            width: 350,
            padding: 10,
            height: "auto",
            modal: true,
            collapsible: false,
            minimizable: false,
            maximizable: false,
            resizable: false,
            onClose: function () {
                setTimeout(function () {
                    win.window("destroy");
                }, 100);
            }
        });
        win.window("window").addClass("messager-window");
        win.children("div.messager-button").children("a:first").focus();
        return win;
    }
    ;
    $.extend($.messager, {
        password: function (title, msg, fn) {
            //var content = "<div class=\"messager-icon messager-question\"></div>" + "<div>" + msg + "</div>" + "<br/>" + "<div style=\"clear:both;\"/>" + "<div><input class=\"messager-input\" type=\"password\"/></div>";            
            /*
             var content = "<div class=\"messager-icon messager-question\"></div>" +
                    "<div>" + msg + "</div>" + "<br/>" +
                    "<div style=\"clear:both;\"/>" +                    
                    "<div class=\"fitem\"><label style=\"width:130px;\">Contrase&ntilde;a Actual:</label><input style=\"width:150px\" type=\"password\" id=\"apassword\" name=\"apassword\" style=\"width:150px\" class=\"messager-pwd\"/></div>" +
                    "<div class=\"fitem\"><label style=\"width:130px;\">Nueva Contrase&ntilde;a:</label><input  style=\"width:150px\" type=\"password\" id=\"npassword\" name=\"npassword\" style=\"width:150px\" class=\"messager-pwd1\"/></div>" +
                    "<div class=\"fitem\"><label style=\"width:130px;\">Repite Contrase&ntilde;a:</label><input style=\"width:150px\" type=\"password\" id=\"cnpassword\" name=\"cnpassword\" style=\"width:150px\" class=\"messager-pwd2\"/></div>" +
                    "</div>";
             */
            var content = "<div class=\"messager-icon messager-question\"></div>" +
                    "<div>" + msg + "</div>" + "<br/>" +
                    "<div style=\"clear:both;\"/>" +  
                    "<label>file:</label><input type=\"file\" name=\"upload\" id=\"upload\"  class=\"easyui-validatebox\" validType=\"fileType['xls']\" required=\"true\"></input>" +
                    "<div class=\"fitem\"><label style=\"width:130px;\">ValidateBox:</label><input type=\"text\" class=\"easyui-validatebox textbox\" data-options=\"required:true,validType:'length[3,10]'\">" +
                    "<div class=\"fitem\"><label style=\"width:130px;\">Contrase&ntilde;a Actual:</label><input style=\"width:150px\" type=\"password\" id=\"apassword\" name=\"apassword\" style=\"width:150px\"   class=\"messager-pwd validatebox\" /></div>" +
                    "<div class=\"fitem\"><label style=\"width:130px;\">Nueva Contrase&ntilde;a:</label><input  style=\"width:150px\" type=\"password\" id=\"npassword\" name=\"npassword\" style=\"width:150px\"   class=\"messager-pwd1 validatebox\"  data-options=\"required:true,validType:'valminLength[5]'\"/></div>" +
                    "<div class=\"fitem\"><label style=\"width:130px;\">Repite Contrase&ntilde;a:</label><input style=\"width:150px\" type=\"password\" id=\"cnpassword\" name=\"cnpassword\" style=\"width:150px\" class=\"messager-pwd1 validatebox\"  data-options=\"required:true,validType:\"equals['#npassword']\"\"/></div>" +
                    "</div>";
            var buttons = {};
            buttons[$.messager.defaults.ok] = function () {
                win.window("close");
                if (fn) {                                        
                    fn($(".messager-pwd", win).val(),
                            $(".messager-pwd1", win).val(),
                            $(".messager-pwd2", win).val()
                            );
                    return false;
                }
            };
            buttons[$.messager.defaults.cancel] = function () {
                win.window("close");
                if (fn) {
                    fn();
                    return false;
                }
            };
            var win = createWindow(title, content, buttons);
            win.find("input.messager-pwd").focus();            
            return win;
        },
        login: function (title, msg, fn) {
            var content = "<div class=\"messager-icon messager-question\"></div>" + "<div>" + msg + "</div>" + "<br/>" + "<div style=\"clear:both;\"/>"
                    + "<div class=\"righttext\">Login ID: <input class=\"messager-id \" type=\"text\"/></div>"
                    + "<div class=\"righttext\">Password: <input class=\"messager-pass\" type=\"password\"/></div>";
            var buttons = {};
            buttons[$.messager.defaults.ok] = function () {
                win.window("close");
                if (fn) {
                    fn($(".messager-id", win).val(), $(".messager-pass", win).val());
                    return false;
                }
            };
            buttons[$.messager.defaults.cancel] = function () {
                win.window("close");
                if (fn) {
                    fn();
                    return false;
                }
            };
            var win = createWindow(title, content, buttons);
            win.find("input.messager-id").focus();
            return win;
        }
    });
})(jQuery);

Code:

// Funcion para abrir dialogo de cambio de contraseña
function openDialog() {
    //$('#dlg-camPass').dialog('open');             
    var win_cambio = $.messager.password('AgendaNet', 'Cambio de Contraseña', function (r) {
        if (r) {
            value0 = r;
            value1 = win_cambio.find("input.messager-pwd1").val();
            value2 = win_cambio.find("input.messager-pwd2").val();

            if (value1 == value2) {
                $.ajax({
                    type: "POST", //el envio es por POST
                    url: "../control_usuarios/change_password.php", //php que recibe y procesa los datos 
                    data: {
                        apassword: value0,
                        npassword: value1
                    }, //los datos de la forma: etiqueta1=valor1&etiqueta2=valor2
                    dataType: "json", //tipo de datos a manejar
                    async: true, //la peticion sera asincrona
                    success: function (result) {
                        if (result.success) { //si los datos fueron correctos, cambio de pagina
                            $.messager.alert('Info', 'Su contraseña ha sido cambiada correctamente.', 'info');
                        } else { //si hubo errores 
                            $.messager.alert('Error', result.error, 'error');
                            //limpio los input's
                            $("#apassword").val("");
                            $("#npassword").val("");
                            $("#cnpassword").val("");
                        }
                    },
                    error: function (result) { //si hubo error en la ejecucion
                        alert("Ocurrio un error inesperado, por favor contacte al administrador. Disculpe las molestias.");
                        //alert("FAILED: "+result.status+' '+result.statusText); //estado del error (pruebas)
                    }
                }); //ajax
            } else {
                $.messager.alert('AgendaNet','Los campos no son iguales!!','error');
            }
        }
    });

Use data-options

readonly:true and
disabled:true

Code:

 <th field= "fecha_fin_real"   
 fixed="true" 
width="115"  
align="center"  
editor="{
type:'datetimebox',
options:{disabled:true,editable:false,readonly:true,currentText:'Hoy',closeText:'Cerrar',okText:'Aceptar',showSeconds:false}}" >
Fecha RealTer
</th>

[min]

Hi partners i have one datagrid with one datetimebox and i need to send min and max  options but not fixed, like in my code.

My need is send dynamic values on min and max, the values for this are in json format and come from all data for datagrid, and  with it values i will pretend restrict date range of my datetimebox

Sample of json data for datagrid, fecha_min and fecha_max are my range date permitted on my datetimebox

Code:

{
    "total": "5",
    "rows": [
        
        {
            "id": "1015",
            "id_evento": "6",
            "id_usuario": "8",
            "rpe": "9M671",
            "solped": "500530548",
            "fecha_ini_prog": "19-05-2015 10:00",
            "fecha_fin_prog": "19-05-2015 12:00",
            "fecha_ini_real": "23-06-2015 10:00",
            "fecha_fin_real": "23-06-2015 12:00",
"fecha_min": "24-06-2015 13:00",
"fecha_max": "31-06-2015 13:00",
          "fecha_real_rango": "23-06-2015 10:00 | 23-06-2015 12:00",
            "duracion": "02:00:00",
            "titulo": "Acto de Apertura SBIE 500530548 LLANTA 11 R-22.5  LPI DIF. 1 18164039-003-15 \"B\"",
            "descripcion": "SBIE 500530548 LLANTA 11 R-22.5",
            "padre": "1",
            "evento": "APERTU",
            "desc_evento": "Acto de Apertura",
            "color": "#64FE2E"
        },
        {
            "id": "1016",
            "id_evento": "7",
            "id_usuario": "8",
            "rpe": "9M671",
            "solped": "500530548",
            "fecha_ini_prog": "22-05-2015 13:00",
            "fecha_fin_prog": "22-05-2015 14:00",
            "fecha_ini_real": "24-06-2015 13:00",
            "fecha_fin_real": "24-06-2015 14:00",
			"fecha_min": "24-06-2015 13:00",
			"fecha_max": "31-06-2015 13:00",
            "fecha_real_rango": "23-06-2015 13:00 | 23-06-2015 14:00",
            "duracion": "01:00:00",
            "titulo": "Evaluación Técnica SBIE 500530548 LLANTA 11 R-22.5 LPI DIF. 1 18164039-003-15 \"B\"",
            "descripcion": "SBIE 500530548 LLANTA 11 R-22.5",
            "padre": "0",
            "evento": "EVALUAT",
            "desc_evento": "Evaluación Técnica",
            "color": "#31B404"
        },
        {
            "id": "1017",
            "id_evento": "8",
            "id_usuario": "8",
            "rpe": "9M671",
            "solped": "500530548",
            "fecha_ini_prog": "22-05-2015 13:00",
            "fecha_fin_prog": "22-05-2015 14:00",
            "fecha_ini_real": "24-06-2015 13:00",
            "fecha_fin_real": "24-06-2015 14:00",
             "fecha_min": "24-06-2015 13:00",
             "fecha_max": "31-06-2015 13:00",
            "fecha_real_rango": "23-06-2015 13:00 | 23-06-2015 14:00",
            "duracion": "01:00:00",
            "titulo": "Evaluación Económica SBIE 500530548 LLANTA 11 R-22.5 LPI DIF. 1 18164039-003-15 \"B\"",
            "descripcion": "SBIE 500530548 LLANTA 11 R-22.5",
            "padre": "0",
            "evento": "EVALUAE",
            "desc_evento": "Evaluación Económica",
            "color": "#31B404"
        },
        {
            "id": "1018",
            "id_evento": "9",
            "id_usuario": "8",
            "rpe": "9M671",
            "solped": "500530548",
            "fecha_ini_prog": "26-05-2015 13:00",
            "fecha_fin_prog": "26-05-2015 15:00",
            "fecha_ini_real": "24-06-2015 13:00",
            "fecha_fin_real": "24-06-2015 15:00",
			"fecha_min": "24-06-2015 13:00",
			"fecha_max": "31-06-2015 13:00",
            "fecha_real_rango": "23-06-2015 13:00 | 23-06-2015 15:00",
            "duracion": "02:00:00",
            "titulo": "Fallo SBIE 500530548 LLANTA 11 R-22.5 LPI DIF. 1 18164039-003-15 \"B\"",
            "descripcion": "SBIE 500530548 LLANTA 11 R-22.5",
            "padre": "0",
            "evento": "FALLO",
            "desc_evento": "Fallo",
            "color": "#FFFFFF"
        },
        {
            "id": "1019",
            "id_evento": "10",
            "id_usuario": "8",
            "rpe": "9M671",
            "solped": "500530548",
            "fecha_ini_prog": "02-06-2015 14:00",
            "fecha_fin_prog": "02-06-2015 15:00",
            "fecha_ini_real": "24-06-2015 14:00",
            "fecha_fin_real": "24-06-2015 15:00",
			"fecha_min": "24-06-2015 13:00",
			"fecha_max": "31-06-2015 13:00",
            "fecha_real_rango": "23-06-2015 14:00 | 23-06-2015 15:00",
            "duracion": "01:00:00",
            "titulo": "Formalización del Contrato SBIE 500530548 LLANTA 11 R-22.5 LPI DIF. 1 18164039-003-15 \"B\"",
            "descripcion": "SBIE 500530548 LLANTA 11 R-22.5",
            "padre": "0",
            "evento": "FORMAL",
            "desc_evento": "Formalización del Contrato",
            "color": "#FFFFFF"
        }
    ]
}

Code:

<th field= "fecha_ini_real"    
                                            fixed="true" 
                                            width="115"  
                                            align="center"                                              
                                            editor="{
                                            type:'datetimebox',
                                            options:{  
                                            min:'21-06-2015',  
                                            max:'28-06-2015',
                                            disabled: false,
                                            editable:false,
                                            currentText:'Hoy',
                                            closeText:'Cerrar',
                                            okText:'Aceptar',
                                            showSeconds:false,
                                            onHidePanel:aumentaHora,
                                            onShowPanel:restringeRango
                                            }
                                            }">
                                            Fecha Inicio
                                        </th>

This is mi validator with fixed values

Code:

function restringeRango() {
    var row = $('#ejec_tt_eventos').datagrid('getSelected');
    //alert( row.fecha_ini_real );
    var opts = $(this).datetimebox('options');    
    $(this).datetimebox('calendar').calendar({
        validator: function (date) {
            var min = opts.parser(opts.min); // fixed value on datetimebox
            var max = opts.parser(opts.max); //fixed value on datetimebox
            if (min <= date && date <= max) {
                return true;
            } else {
                return false;
            }
        }
    });
}

Hi partners, i have a doubt in the method validaterow for one datagrid, in this example http://www.jeasyui.com/forum/index.php?topic=4165.msg9926#msg9926 one column appear with two datetime inputs avoiding missing datetimes:

The fisrt datetime must be less than the second date, the validator works fine and send tooltip error but when i click to another row in datagrid the missing row appears active and the new clicked row is activated to edit in, i have singleSelect on true

How to avoid this situation?

This is my code

Code:

<table id="ejec_tt_eventos"
                                   class        = "easyui-datagrid"
                                   style="width: 770px;"
                                   data-options="
                                   title        : 'Agenda de Eventos',
                                   autoLoad     : true,
                                   fitColumns   : false,
                                   pagination   : false,
                                   striped      : true,
                                   singleSelect : true,
                                   //onAfterEdit  : acceptEjec,
                                   collapsible  : false,
                                   onAfterEdit: function(rowIndex, rowData,changes) {
                                   alert('Despues de la edicion');
                                    console.log(changes);
                                   },
                                   onBeforeEdit: function(rowIndex, rowData) {
                                   if (rowData.padre == 1 ){
                                   return false;
                                   } else {
                                   return true;
                                   }
                                   }"
                                   >
                                <thead>
                                    <tr>
                                        <th field= "id" width="20" hidden="true">ID</th>
                                        <th field= "id_evento" width="20">ID</th>
                                        <th field= "id_usuario" width="40" hidden="true">ID Usuario</th>
                                        <th field= "rpe" width="40" hidden="true">RPE Usuario</th>
                                        <th field= "desc_evento" width="160">Evento</th>
                                        <th field= "fecha_ini_prog" width="125" align="center">Fecha Inicio Prog.</th>
                                        <th field= "fecha_fin_prog" width="125" align="center">Fecha Termino Prog.</th>
                                         <th field= "fecha_real_rango" width="250" align="center" editor="{type:'datetimeboxrange',options:{validType:'dateRangeCheck',editable:false,currentText:'Hoy',closeText:'Cerrar',okText:'Aceptar',showSeconds:false}}">Fecha Ejecución</th>
                                        <th field= "padre" width="80" formatter="formatItemClock_grid" editor="{type:'checkbox', options:{on: '1', off: '0'}, required:true}">Realizado</th>
                                    </tr>
                                </thead>
                            </table>

And it is for control edition

Code:

var editIndexEjec = undefined;
function endEditingEjec() {
    alert('Terminando la edición editIndexEjec:' + editIndexEjec);
    if (editIndexEjec == undefined) {
        return true;
    }
    if ($('#ejec_tt_eventos').datagrid('validateRow', editIndexEjec)) {
        $('#ejec_tt_eventos').datagrid('endEdit', editIndexEjec); //Finaliza Edicion
        editIndexEjec = undefined;
        return true;
    } else {
        return false;
    }
}

 

$(function () {
    var lastIndexEjec;
    $('#ejec_tt_eventos').datagrid({
        onClickRow: function (rowIndex, row) {
            alert('Iniciando Edicion en el renglon ' + rowIndex)
            if (lastIndexEjec != rowIndex) {
                $('#ejec_tt_eventos').datagrid('endEdit', lastIndexEjec);
                $('#ejec_tt_eventos').datagrid('beginEdit', rowIndex);
                setEditingEjec(rowIndex, row);
                renglon = rowIndex;
            }
            lastIndexEjec = rowIndex;
            renglon = rowIndex;
        }
    });
});

function setEditingEjec(rowIndex, row) {
    var editors = $('#ejec_tt_eventos').datagrid('getEditors', rowIndex);
    alert('en SetEditing del renglon ' +  rowIndex);
    if (row.padre == undefined || row.padre == '0') {
        $(editors[0].target).focus();
    } else {
        endEditingEjec();
    }
}

function acceptEjec() {
    if (endEditingEjec()) {
        $('#ejec_tt_eventos').datagrid('acceptChanges');
    }
}

function cancelrowEjec(target) {
    $('#ejec_tt_eventos').datagrid('cancelEdit', getRowIndex(target));
}

function editrowEjec(target) {
    $('#ejec_tt_eventos').datagrid('beginEdit', getRowIndex(target));
}

function removeitEjec() {
    $.messager.confirm('Confirmar', '¿Esta seguro de eliminar el registro?', function (r) {
        if (r) {
            $('#ejec_tt_eventos').datagrid('cancelEdit', renglon).datagrid('deleteRow', renglon);
            editIndexEjec = undefined;
        }
    });
}

function rejectEjec() {
    $('#ejec_tt_eventos').datagrid('rejectChanges');
    editIndexEjec = undefined;
}

Thanks in advance

why???

Check your datagrid definition, you have two columns with the same name of field, and this it refers to diferent formatter

Hi partners, i need to show messager alert with errors but the default size don´t fit to the messages, are there any code to change the size to window alert?

My code is it:

Code:

 $.messager.alert('Sistema de SOLPEDS y Pedidos', jsondata.mensaje, 'error');

Above line work fine.

In one example i see this with show but it close after some timeout, and i need show it but that user close it.

Code:

$.messager.show({
                                     title: 'Sistema de SOLPEDS y Pedidos, errores en fechas',
                                     msg:jsondata.mensaje,
                                     icon: 'error',
                                     // timeout:4000,
                                     showType: 'show',
                                     width: 600,
                                     height: 350,
                                     style: {
                                     right: '',
                                     top: document.body.scrollTop + document.documentElement.scrollTop,
                                     bottom: ''
                                     }
                                     });

Thanks in advance

Use this code

Code:

$('#dg').datagrid({
    onBeforeEdit: function(index,row){
        var col = $(this).datagrid('getColumnOption', 'columnName'); // Here your column name
        if (some condition){
            col.editor = 'text';
        } else {
            col.editor = null;
        }
    }
})

Hi, check this url

http://www.jeasyui.com/forum/index.php?topic=342.0

Thanks a lot, this work perfectly 

[how to program one validator?]

Hi friends, i have some problems to validate one column (datetimebox) in a Datagrid, the column show two datetimebox and I need validate both datetime like some example ( From - To) when From must be less than To

This is my code:

Extension for datetimebox

Code:

<script>
            $.extend($.fn.datagrid.defaults.editors, {
                datetimeboxrange: {
                    init: function(container, options) {
                        var c = $('<div style="display:inline-block"><input class="d1"><input class="d2"></div>').appendTo(container);
                        c.find('.d1,.d2').datetimebox();
                        return c;
                    },
                    destroy: function(target) {
                        $(target).find('.d1,.d2').datetimebox('destroy');
                    },
                    getValue: function(target) {
                        var d1 = $(target).find('.d1');
                        var d2 = $(target).find('.d2');
                        return d1.datetimebox('getValue') + ':' + d2.datetimebox('getValue');
                    },
                    setValue: function(target, value) {
                        var d1 = $(target).find('.d1');
                        var d2 = $(target).find('.d2');
                        var vv = value.split(':');
                        d1.datetimebox('setValue', vv[0]);
                        d2.datetimebox('setValue', vv[1]);
                    },
                    resize: function(target, width) {
                        $(target)._outerWidth(width)._outerHeight(22);
                        $(target).find('.d1,.d2').datetimebox('resize', width / 2);
                    }
                }
            });
</script>

The body of datagrid is the next code

Code:

<table id="dg" 
               title="DataGrid" 
               style="width:950px;height:250px" 
               data-options="
               singleSelect:true,
               data:data
               ">
            <thead>
                <tr>
                    <th data-options="field:'itemid',width:80">Item ID</th>
                    <th data-options="field:'productid',width:100">Product</th>
                    <th data-options="field:'listprice',width:80,align:'right'">List Price</th>
                    <th data-options="field:'unitcost',width:80,align:'right'">Unit Cost</th>
                    <th data-options="field:'attr1',width:250">Attribute</th>
                    <th data-options="field:'status',width:60,align:'center'">Status</th>                    
                    <th data-options="field:'fecha_fin_prog',width:250,align:'center'" editor="{type:'datetimeboxrange',options:{validType:'dateRangeCheck',editable:false,readonly:true,currentText:'Hoy',closeText:'Cerrar',okText:'Aceptar',showSeconds:false}}" >Fecha Termino</th>
                    
                </tr>
            </thead>
        </table>

My question is how to program one validator? to avoid  date1 > date2 , my requirement is date1 <= date2

Thanks in advance 

Thanks stworthy i will test it, have a nice day