I want an autosave feature with the text editor, but when i use the "getValue" method, it doesn't always reflect what is displayed on the (text editor) page.

I'm only using getValue when either the space bar or enter key is pressed, but quite often the data I'm then saving to a database is words or lines old.

Can anyone help / advise ?

OK, I solved this myself, code below for anyone that runs into a similar issue (probably for most controls).


$(function(){

$('.easyui-texteditor').on('keyup',function(e){
    var idname = $(this).attr('id');
    console.log(idname);
    console.log(e.keyCode)
  });

})

Hope this helps someone

I have  text editors on different tabs and detect a keypress for autosave like this (simplified for easy reading)

$(function(){
    $('#texteditor1').on('keyup',function(e){
       

        console.log(e.keyCode)

    })
})

Rather than have five functions to check each editor, I would like to have one function to check a keypress and take action depending on what tab was selected, is this possible ?

I'd like to have icons show in the combobox both when it's been selected and when choosing (eg in the dropdown choice).

If I hard code it like this it's possible

data: [
        {value:'RAL1001',text:'Green Beige',iconCls:'RAL1001'},
     {value:'RAL1002',text:'Sand Yellow',iconCls:'RAL1001'}
   ]

There's dozens of choices and they can change (depending upon stock levels), therefore i'd like to load the data from a datatbase or .json file, but whilst the Value and text fields are easy to populate, the "icon", doesn't work.

I've used the formatter function but this only works in the "drop down" choice, the icon isn't displayed after you've made a choice.

Can anyone help ?

Thank you for the help, but unfortunately the code isn't working correctly.

The time is now displayed at the bottom of the calendar is now correct, but if I choose a different time, this isn't reflected in the text area, it also isn't choosing the correct date, if I choose today, instead of displaying "17/05/2017" it shows "17/06/2017".

I am wanting the easyui-datetimebox to display the date and time in UK format which is "dd mm yyyy", for example today would be displayed as "16/5/2017 17:46:53".

I can get this to work (code below), but whenever I click on the calendar icon in the textbox to open the small calendar, the time displayed at the bottom is always "00:00:00" and even if I change it to something else, it doesn't get updated correctly, the current time replaces it (which I realise is because of my code).



This page/site is for UK usage only, therefore if I need to change the original source code to reflect UK dates, that won't be an issue.

Code :-
<input class="easyui-datetimebox" value="16/5/2017" data-options="label:'mm/dd/YYYY',labelPosition:'top',formatter:ukformatter,parser:ukparser" style="width:100%;">

<script type="text/javascript">
 function ukformatter(date){
       var y = date.getFullYear();
             var m = date.getMonth() + 1;
             var d = date.getDate();
            //var t = date.GetTime();
           var dt = new Date();
          var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
            
            
            // date format dd/mm/yyy
             var r = (d < 10 ? ('0' + d) : d) + '/' + (m < 10 ? ('0' + m) : m) + '/' + y + ' ' + time;
            //var r = (d < 10 ? ('0' + d) : d) + '/' + (m < 10 ? ('0' + m) : m) + '/' + y
             return r;
   }
   function ukparser(s){
   if (!s) {
                 return new Date();
             }
            // date format dd/mm/yyyy
             var ss = (s.split('/'));
             var d = parseInt(ss[0], 10);
             var m = parseInt(ss[1], 10);
             var y = parseInt(ss[2], 10);
            
             if (!isNaN(y) && !isNaN(m) && !isNaN(d)) {
                 return new Date(y, m - 1, d);
             } else {
                 return new Date();
             }
         }
         

</script>

I want to load local files into different tabs using href, but when I do, all styling from the page I'm trying to load is missing,

EG :-

<div title="Calendar" data-options="href:'http://localhost/BS2/wdCalendar/wdCalendar/sample.php',closable:true" style="padding:10px"></div>


I can't use an iframe as the calendar above doesn't display correctly.


Any advice anyone ?

Thank you so much, that now works perfectly.

For anyone else who has this issue, here is how I implemented it :


<table id="dg" title="text here" class="easyui-datagrid" style="width:1500px;height:100%"
   
    data-options="
         url:'./support_files/get_users.php',
         toolbar:'#toolbar',
         pagination:true,
         rownumbers:true,
         fitColumns:true,
         singleSelect:true,
            idField:'ID',
           onClickRow:function(){
            showUser();
         }
      " >
   

[DON'T]

I want to be able to highlight (eg select) the same row in a datagrid after reloading the data (eg after saving a change in a form).

If I DON'T call 'reload' (which I need to do to display the changes made on a form) I can select a row by calling 'selectRow', but if DO call 'reload', no row is selected.  Is there a workaround ?, is this a bug?, am I doing something wrong? .

Here is the code I'm using :-

var row = $('#dg').datagrid('getSelected');
var index = $('#dg').datagrid('getRowIndex', row);
   
$('#dg').datagrid('reload');   // reload the user data
$('#dg').datagrid('selectRow', index);

Thank you in advance for any assistance.