Forum

November 2nd, 2014
A A A
Avatar

Lost password?
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

The forums are currently locked and only available for read only access
sp_Feed Topic RSS sp_TopicIcon
Unable to use formatter
23/07/2009
12:15
Avatar
SimonL
Member
Members
Forum Posts: 39
Member Since:
23/07/2009
sp_UserOfflineSmall Offline

Hi,

I've just started using jqGrid (which is excellent by the way). I've ticked all the boxes on the download page and then clicked download. After unzipping the download I added the files to my project (ASP.NET MVC application). I've managed to get the grid up and running quite nicely but I can't seem to get any of the formatting to work.

I've added the following links to my page:

    <script src="<%= Url.Content("~/Scripts/jquery-1.3.2.min.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/jquery-ui-1.7.2.custom.min.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/grid.locale-en.js")%>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/jquery.jqGrid.min.js") %>" type="text/javascript"></script>

and the following script block:

    <script type="text/javascript">
        $(function() {

            jQuery("#list").jqGrid({
                url: '/Admin/Gallery/GetListData/',
                datatype: 'json',
                mtype: 'GET',
                colNames: ['ID', 'Stock Number', 'PO Number', 'Description', 'Cost Price', 'Ticket Price', 'Sold', 'Artist', 'Medium', 'Source', 'Owner'],
                colModel: [
                  { name: 'ID', hidden: true, index: 'ID', width: 40, align: 'left' },
                  { name: 'StockNumber', index: 'StockNumber', width: 40, align: 'left' },
                  { name: 'PONumber', index: 'PONumber', width: 40, align: 'left' },
                  { name: 'Description', index: 'Description', width: 200, align: 'left' },
                  { name: 'CostPrice', formatter: 'currency', index: 'CostPrice', width: 50, align: 'right'},
                  { name: 'TicketPrice', formatter: 'currency', index: 'TicketPrice', width: 50, align: 'right' },
                  { name: 'IsSold', formatter: 'checkbox', index: 'IsSold', width: 55, align: 'center' },
                  { name: 'ArtistName', index: 'ArtistName', width: 100, align: 'left'},
                  { name: 'Medium', index: 'Medium', width: 80, align: 'left'},
                  { name: 'Source', index: 'Source', width: 80, align: 'left'},
                  { name: 'StockOwner', index: 'StockOwner', width: 80, align: 'left' }
                ],
                autowidth: true,
                pager: jQuery('#pager'),
                rowNum: 20,
                rowList: [5, 10, 20, 50],
                sortname: 'ArtistName',
                sortorder: "asc",
                viewrecords: true,
                imgpath: '/scripts/themes/ui-darkness/images',
                caption: 'Gallery'
            }).navGrid('#pager',{edit:true,add:false,del:true});

        });
</script>

    <!-- JqGrid & pager place holders -->
    <table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
    <div id="pager" class="scroll" ></div>

As I said, the grid appears and works correctly, but I can't get any formatting working (checkboxes, currncey etc).

Also I can't modify the pager.

Can you help please.

Regards,

Simon

24/07/2009
02:36
Avatar
veechand
India
Member
Members
Forum Posts: 12
Member Since:
08/04/2009
sp_UserOfflineSmall Offline

I didn't see any CSS being included

-Veerabahu

24/07/2009
02:54
Avatar
SimonL
Member
Members
Forum Posts: 39
Member Since:
23/07/2009
sp_UserOfflineSmall Offline

Veerabahu,

Sorry, the CSS files are being included I just didn't list them in my post thay are include as follows just below my script block:

    <link href="../../Scripts/css/ui.jqgrid.css" rel="stylesheet" type="text/css" />
    <link href="../../Content/AdminSite.css" rel="stylesheet" type="text/css" />
    <link href="../../Scripts/Themes/ui-darkness/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />

Can you think of any other reason the formatting is not working.

Regards,

Simon

27/07/2009
03:37
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Hello,

What does not work in the formatter? 

Open the language file grid.locale-en.js and see what are the settings for the currency and what you expect to be.

If you expect $ to appear it will be not. You should configure this manually. Refer to docs how to do this.

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

27/07/2009
03:41
Avatar
SimonL
Member
Members
Forum Posts: 39
Member Since:
23/07/2009
sp_UserOfflineSmall Offline

Thanks Tony, I appear to have it all working correctly now, very impressed with you're work, thanks again.

Regards,

Simon

06/11/2009
02:19
Avatar
yial2
Guest
Guests

Hi Simon and Tony,

I have exactly same problem with Simon. I checked the doc but still don't have a clue about how to make the formatter work. (I need to get checkbox to work, but the column is just showing my data - Yes/No - as plain text...)

Simon, can you share your finding? Thanks in advance!

Tony, do you have any other recommendation other than the doc for me? (by the way, jqGrid is really great!)

06/11/2009
04:18
Avatar
SimonL
Member
Members
Forum Posts: 39
Member Since:
23/07/2009
sp_UserOfflineSmall Offline

Hi Yial,

Its quite a long time since I had this problem so I can't remember how I managed to get it working. But if you could post your code for your grid and show which .js files and .css files you are including (Like I did in my posts) then maybe we can help. I'm sure Tony would ask you to do the same - its difficult to advise without seeing your code.

Regards,

Simon

06/11/2009
11:02
Avatar
yial2
Guest
Guests

Hi Simon,

Thanks for prompt reply! My code is pretty much similar to the one you posted, please see below....

    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
    <link href="../../Scripts/jqueryUI/css/ui-lightness/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />
    <link href="../../Scripts/jqGrid/css/ui.jqgrid.css" rel="stylesheet" type="text/css" />

    <script src="<%= Url.Content("~/Scripts/MicrosoftAjax.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/jquery-1.3.2.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/jqGrid/js/i18n/grid.locale-en.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/jqGrid/js/jquery.jqGrid.min.js") %>" type="text/javascript"></script>

    <script type="text/javascript">
        jQuery(document).ready(function(){
          jQuery("#list").jqGrid({
            url:'/Dinners/GridData/',
            datatype: 'json',
            mtype: 'GET',
            colNames:['Id', 'Title', 'Date', 'Join'],
            colModel :[
              { name: 'Id', index: 'DinnerID', width: 40, align: 'left' },
              { name: 'Title', index: 'Title', width: 200, align: 'left' },
              { name: 'Date', index: 'EventDate', width: 200, align: 'left' },
              { name: 'Join', index: 'Join', width: 200, align: 'center', formatter: 'checkbox' }],
            pager: '#pager',
            rowNum:5,
            rowList:[5,10,20,50],
            sortname: 'DinnerID',
            sortorder: "desc",
            viewrecords: true,
            imgpath: '../../Scripts/jqueryUI/css/ui-lightness/images',
            caption: 'My first grid'
          });
        });
    </script>
   

    <h2>My Grid Data</h2>
    <div id="jqgrid">
        <table id="list" cellpadding="0" cellspacing="0"></table>
        <div id="pager"></div>
    </div>

I have been stucked with this problem for 3 days, so your help is greatly appreciated!! Wink

06/11/2009
12:23
Avatar
tony
Sofia, Bulgaria
Moderator
Members

Moderators
Forum Posts: 7721
Member Since:
30/10/2007
sp_UserOfflineSmall Offline

Hello,

Could you please post the response from server?

Also another check - Open jquery.jqGrid.js with text editor and see the line

Modules: ....

Check if you have jquery.fmatter.js here.

Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

06/11/2009
15:15
Avatar
yial2
Guest
Guests

Tony,

Thank You!

My original jquery.jqGrid.js did NOT inclue jquery.fmatter.js in “Modules….”. I didn't include the formatter when I first downloaded the jqGrid. Now it is working NICELY after I downloaded the package which included formatter. Thank You Thank You!! Laugh

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
52 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information