0

I am using jqgrid on my form and I am creating the column delete and want to send the object in javascript function, the code is following

 {
                    name: "action",
                    align: "center",

                    sortable: false,
                    title: false,
                    fixed: true,
                    search: false,
                    formatter: function (cellValue, options, rowObject) {
                        debugger;
                        var markup = "<a title=\"%ToolTip%\" href=%Href%;>%Text%</a>";
                        var replacements = {
                            "%Text%": "<i class='fa fa-trash' style='color:black'></i>",
                            "%ToolTip%": UserRoles.messages && UserRoles.messages.ClickHereToDelete
                                ? UserRoles.messages.ClickHereToDelete : "",
                            "%Href%": "javascript:UserRoles.deleteUserRoles(" + rowObject + ")"
                        };
                        markup = markup.replace(/%\w+%/g, function (all) {
                            return replacements[all];
                        });
                        return markup;
                    }
                }

I want to send the object in the function deleteUserRole by this line

"%Href%": "javascript:UserRoles.deleteUserRoles(" + rowObject + ")"

but it is giving me output

<a title="" href="javascript:UserRoles.deleteUserRoles([object" object]);=""><i class="fa fa-trash" style="color:black"></i></a>

can any one help me

Billz
  • 1,067
  • 6
  • 25
  • 57
  • Which version of jqGrid and which fork you use? What should do `UserRoles.deleteUserRoles` function? Could you include it's code? In general it's enough to know the `id` of the row and probably one-two additional values for deleting the item. Where you hold the information? In which column? Do you have the data in another column? Moreover the code of `formatter` seems very strange. You first insert texts like `%ToolTip%` then the **immediately replace** the substrings in another value. Is it not easy to construct correct values directly? By the way, do you tried `formatter: "actions"`? – Oleg Oct 01 '15 at 13:01
  • Actually I have 16 values in JQgrid and I want to delete the row on the basis of these 16 values so I want to send the object so I can compare the whole object with collection. – Billz Oct 01 '15 at 13:07
  • **Which version of jqGrid and which fork you use?** Do you have 16 **columns** or more or the 16 values exists only in the input data, but not in the columns on the grid? – Oleg Oct 01 '15 at 13:15

1 Answers1

1

Mostly one don't need to create such custom formatter and one can use just formatter: "action" with the corresponding parameters.

It's important to understand that the goal of formatter is providing the HTML fragment which will be placed in cells (in <td>) of the column. The rowObject are typically the input data of the row which format depend on many factors.

What you probably need is to use options.rowId as parameter of UserRoles.deleteUserRoles function. Inside of the function you can use getRowData to get the data based on the rowid.

I would recommend you to read the answer and all old answer referenced i the answer. It shows that one can just use place "<a href='#'><i class='fa fa-trash' style='color:black'></i></a>" by custom formatter **without using any javascript:UserRoles.deleteUserRoles(...) fragment. Instead of that one can implement beforeSelectRow callback which tests in which column the user clicked. If the user clicked on the <a> of "action" column then one can do some custom action. The way is more effective because one don't need bind global function to every <a> element of the column. One can simplify the content of the column by removing <a> and holding only <i class='fa fa-trash' style='color:black'></i> inside of the column. The code of beforeSelectRow callback will be the same.

Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • At the time of adding, it always gives me rowId = 1. – Billz Oct 01 '15 at 13:33
  • Could you answer on the question which I asked you 3 times: **Which version of jqGrid and which fork you use?** If you have the same `options.rowId` for all rows then you fill the grid in the wrong way. You should have more serious problems if you don't fix the problem. You should append the text of your question with more full code which shows how you create the grid and how you fill it. You should include 2-3 rows of input data which you use. – Oleg Oct 01 '15 at 13:37
  • I am using @license jqGrid 4.4.4 - jQuery Grid. Let me edit the question with more code – Billz Oct 01 '15 at 13:39
  • its ok dear, after adding Row number is working perfectly – Billz Oct 01 '15 at 13:41
  • @Billi: You are welcome! I recommend you to update retro version jqGrid 4.4.4 to the current version of free jqGrid (currently 4.9.2). If you installed it from NuGet. Then you should uninstall [jQuery.jqGrid](https://www.nuget.org/packages/jQuery.jqGrid/) package and install [free-jqGrid](https://www.nuget.org/packages/free-jqGrid/) package instead. Free jqGrid supports for example Font Awesome out of the box (see [the wiki article](https://github.com/free-jqgrid/jqGrid/wiki/Using-Font-Awesome-in-free-jqGrid-4.8)). – Oleg Oct 01 '15 at 13:46