CODEWITHSUNDEEP
javascriptjqueryjqgriduppercase
Andrus
Andrus

Reputation: 27955

how to implement uppercase conversion in jqgrid

Producr codes can contain only uppercase charcters. If lowercase characters are enterd, jqgrid does not convert them to upper case, there is not such option. How to force uppercase conversion of entered characters in jqgrid in inline and form edit modes for text fields ?

Update

I found code in How can I force input to uppercase in an ASP.NET textbox? last answer . This code changes entered character in uppercase in keypress. Is it reasonable to use this by adding keyprees event handler to jqgrid editing controls?

function ToUpper() { 
        // So that things work both on FF and IE 
        var evt = arguments[0] || event; 
        var char = String.fromCharCode(evt.which || evt.keyCode); 

        // Is it a lowercase character? 
        if (/[a-z]/.test(char)) { 
            // convert to uppercase version 
            if (evt.which) { 
                evt.which = char.toUpperCase().charCodeAt(0); 
            } 
            else { 
                evt.keyCode = char.toUpperCase().charCodeAt(0); 
            } 
        } 

        return true; 
    }

Used like so:

   <asp:TextBox ID="txtAddManager" onKeyPress="ToUpper()" runat="server"  
         Width="84px" Font-Names="Courier New"></asp:TextBox>

Upvotes: 1

Views: 7529

Answers (2)

Oleg
Oleg

Reputation: 222007

First of all you can use CSS style text-transform: uppercase to display the data typed by the user in uppercase:

editoptions: { dataInit: function (el) { $(el).css('text-transform', 'uppercase'); }}

The setting will not change the data itself. So you have to make the corresponding modification additionally. In case of form editing you can use beforeSubmit. For example, let us you have column 'name' which you need to hold uppercase. Then you first add the setting of text-transform: uppercase in dataInit (see above) and add

beforeSubmit: function (postData) {
    postData.name = postData.name.toUpperCase();
    return [true, ''];
}

In case of inline editing there are no beforeSubmit callback function. so you can use serializeRowData if you have remote data:

serializeRowData: function (postData) {
    postData.name = postData.name.toUpperCase();
    return postData;
}

In case of usage editurl: 'clientArray' you can fix the data in aftersavefunc parameter of editRow and saveRow:

aftersavefunc: function (rowid) {
    var $grid = $(this),
        newName = $grid.jqGrid("getCell", rowid, 'name');
    $grid.jqGrid("setCell", rowid, 'name', newName.toUpperCase());
}

See the demo.

Upvotes: 1

4b0
4b0

Reputation: 22323

try:

 $(document).ready(function(){
          $("div").text("lower case.");
          var UCASE =  $("div").text($("div").text().toUpperCase());
          alert(UCASE);
    });

or

$(document).ready(function(){    
   var strVal = 'lowerCase!!' ;  
   alert(strVal.toUpperCase()); 
});

Upvotes: 0

Related Questions