Guriddo » Topic: Registering a customer formatter

Registering a customer formatter

Guriddo
Registering a customer formatter

This topic has 10 replies, 3 voices, and was last updated 16 years, 4 months ago by SimonL.

Creator

Topic

November 20, 2009 at 6:17 am #74745

Participant

<span class="sy0">Hi,<br /><br />I wrote a custom formatter and it works perfectly well. I want to use it in all my grids in my application so I decided to <br />use the extends function to register it  (I&#39;m using version 3.5 of jqGrid). But when I run my application firebug tells me that the  <br /></span>editButtonFormatter function is not defined. <br /><br />I have the following code that runs after jqGrid javascript file is loaded. <br /><span class="sy0"><br /><</span>script type<span class="sy0">=</span><span class="st0">"text/javascript"</span><span class="sy0">></span><br />        $.extend($.fn.fmatter, {<br />        editButtonFormatter: function(cellvalue, options, rowObject) {<br />                return "Edit Link";<br />                //  Note: I&#39;ve edited out the real code here just to make it very simple - but it still doesn&#39;t get registered<br />                //                var editURL = $(gridSelector).getGridParam(&#39;editURL&#39;);<br />                //                return "<a href=" + editURL + getPrimaryKey(rowObject) + " rel="nofollow">" + "Edit" + "</>";<br />            }<br />        });<br /><br /><br />Can you tell me what I&#39;m doing wrong please.<br /><br />Regards,<br />Simon</a>

Hi, I wrote a custom formatter and it works perfectly well. I want to use it in all my grids in my application so I decided to use the extends function to register it (I'm using version 3.5 of jqGrid). But when I run my application firebug tells me that the editButtonFormatter function is not defined. I have the following code that runs after jqGrid javascript file is loaded. <script type="text/javascript"> $.extend($.fn.fmatter, { editButtonFormatter: function(cellvalue, options, rowObject) { return "Edit Link"; // Note: I've edited out the real code here just to make it very simple - but it still doesn't get registered // var editURL = $(gridSelector).getGridParam('editURL'); // return "<a href=" + editURL + getPrimaryKey(rowObject) + " rel="nofollow">" + "Edit" + "</>"; } }); Can you tell me what I'm doing wrong please. Regards, Simon</a>

Creator

Topic

Viewing 10 replies - 1 through 10 (of 10 total)

Author

Replies
November 21, 2009 at 8:12 am #90905

tony
Keymaster

Hello,

How you call it into the code?

Maybe you will call it this way:

colModel[

{name'some'… formatter:'editButtonFormatter'…},

…

]

…

November 21, 2009 at 9:45 am #90911

SimonL
Participant

Hi Tony,

Yes thats how I call it in my grid code:

colModel[

{

…

name: 'editLink', search: false, sortable: false, hidden: false, index: 'editLink', width: 20, align: 'center', formatter: editButtonFormatter },

…

]

But this causes the “editButtonFormatterfuntion is not defined” error.

When I was creating the function initially I just added a function underneath my grid code like so:

 function editButtonFormatter (cellvalue, options, rowObject) { 

1

 function editButtonFormatter (cellvalue, options, rowObject) { 

November 21, 2009 at 10:54 am #90915

tony
Keymaster

Hello,

IMHO this should work.

Instead can you try this way

$.fn.fmatter.editButtonFormatter = function(cellval,opts) {

// do something here

}

Tony

P.S. I will try to reproduce your code.

Regards

November 21, 2009 at 11:22 am #90916

SimonL
Participant

Hi Tony,

I tried you suggestion but unfortunately I still get the error.

My code …

November 21, 2009 at 11:47 am #90917

tony
Keymaster

Hello,

Testing your exact example brig to not working code:

The reason is this pice of code (I will correct it in 3.6.1)

November 21, 2009 at 12:37 pm #90921

Mark
Participant

Tony wrote:

In other word – make your function with lowecase words – i.e editbuttonformatter (and call it with lower cases) and it will work.

I think that's half the answer. But the other half is here:

{ name: 'editLink', search: false, sortable: false, hidden: false, index: 'editLink', width: 20, align: 'center', formatter: editButtonFormatter }

I believe you need to pass in a string:

formatter: "editButtonFormatter"

(and I dont think the case matters here, just in the definition).

Mark

November 23, 2009 at 8:04 am #90941

SimonL
Participant

Thank you Tony and Mark for your replies. A combination of your two solutions does help. the editButtonFormatter function is at least now being called, but there seem to still be soome issues. Originally when I called the editButtonFormatter by just adding the function to my code without going dow the $.fn.fmatter.editButtonFormatter route the cellValue parameter was undefined,

the options parameter held values of the colModel etc and rowObject held the values of the other columns on the row. I'm using a value in the rowObject to pick out a particular column value so rowObject is important to me.

However, when I define the editButtonFormatter via $.fn.fmatter.editButtonFormatter and wrap it in quotes in the colModel. Then when editButtonFormatter is called the cellvalue parameter is undefined, the options parameter does hold the colModel details but the rowObject contains “add” and not the values of the other columns in the row. So there do still appear to be some problems.

Is there anything else I should try?

Regards,

Simon

November 23, 2009 at 12:08 pm #90962

tony
Keymaster

Hello Simon,

Thanks for this too. There was another bug regrading this. Also I have fixed this and you can download the 3.6.1 release with the fix.

Best Regards

Tony

November 23, 2009 at 12:11 pm #90963

SimonL
Participant

Thanks Tony, I will download 3.6.1 tomorrow and give it a try, thanks again for you quick response.

Regards,

Simon

November 24, 2009 at 5:00 am #90988

SimonL
Participant

Thanks Tony, I've downloaded 3.6.1 and I can now set my custom formatters as defaults, thanks again.

Also, is it possible to set columns as defaults. I have two columns (the edit and delete button columns described above) that appear on every grid in my application. I've quickly tried using

…

$.extend($.jgrid.defaults, {
Author

Replies