0

I am creating JQgrid dynamically using JSON data returned from a WCF service. All the single value attributes like name,editable etc get binded successfully. But I need to apply currency format on the value getting displayed in grid. For this I have set formatter: currency and for adding formatoptions I have used a class with prefix as its member and set its value as '$' . In the output formtoptions appear as "formatoptions":[{"prefix":"$"}] but not able to set on grid. Also tried with simple string text as "formatoptions":"{prefix: $}" but no success.

Complte JSON format of model is:

{\"name\":\"month\",\"editable\":true,\"width\":\"100\",\"formatter\":\"currency\",\"hidden\":false,\"align\":\"right\",\"formatoptions\":\"{prefix: $}\"}]"}

Can you please help in applying formatoptions on JQgrid when creating the columns and column models dynamically using WCF service returning JSON data .

Thanks

Fatemeh Abdollahei
  • 3,040
  • 1
  • 20
  • 25
supriya khamesra
  • 133
  • 3
  • 18

1 Answers1

0

Both "formatoptions":"{prefix: $}" and "formatoptions":[{"prefix":"$"}] are wrong. The correct would be the usage of "formatoptions":{"prefix":"$"}.

UPDATED: Your demo uses wrong data for formatoptions property:

\"formatoptions\":\"{\\\"prefix\\\":\\\"$\\\"}\"

which corresponds the string '{"prefix":"$"}' instead of

\"formatoptions\":{\"prefix\":\"$\"}

which corresponds the object {"prefix":"$"}

Fixing of the data solves the problem. See https://jsfiddle.net/oyavoe00/1/

Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Thanks for the reply Oleg. But "formatoptions":{"prefix":"$"} is still not setting the currency symbol in the JQgrid. – supriya khamesra Nov 07 '17 at 06:36
  • @supriyakhamesra: You are welcome! I'm sure that you made some error. The settings `"formatoptions":{"prefix":"$"}` must work. It's simply the standard way of usage `formatter: "currency"`. Could you provide the demo, which reproduces the problem? Till now you don't posted any line of the code and just explained what you think the code do. Frequently it's difficult to find errors in his own program. I recommend you additionally to use Network tab of Developer Tools of Chrome/IE or [Fiddler](https://www.telerik.com/fiddler) to examine the exact JSON data returned from the server – Oleg Nov 07 '17 at 08:48
  • The demo is uploaded on the link https://jsfiddle.net/oyavoe00/ The demo is uploaded on the link https://jsfiddle.net/oyavoe00/ . The sample json code returned from web service for column model containing the formatoptions as prefix is added in demo . Please let us know where we are doing the mistake. – supriya khamesra Nov 08 '17 at 14:42
  • @supriyakhamesra: Look at the UPDATED part of my answer. – Oleg Nov 08 '17 at 15:14
  • @supriyakhamesra: I suppose additionally that you return JSON data from WCF in the wrong way. The WCF method should return **object** and not a string. ASP.NET framework will convert object to string. If you return the string (JSON string) then ASP.NET will makes **the second** serialization/conversion of the string to JSON, which makes just escaping of all `\` and `"` symbols. Only because of that you need call `JSON.parse` explicitly in your JavaScript code. – Oleg Nov 08 '17 at 15:19
  • Thanks Oleg. Your solution worked. By returning a object we are able to set the formatoptions. Can we apply validation on the input text to allow only numeric value. As entering an alphanumeric replace the text with NAN. – supriya khamesra Nov 09 '17 at 13:48
  • @supriyakhamesra: You are welcome! There are a lot of possibilities to apply validation of the inputs. For example, one can use `editrules: { number: true }` or other `editrules` properties (`minValue`, `maxValue`, `custom` validation via callback function , ...). One set `keydown` event handler to prevent entering of wrong characters (try the demo from [the old answer](https://stackoverflow.com/a/8412707/315935)) and so on. – Oleg Nov 09 '17 at 14:17