Escaping Json content - json

I am using AJAX function to update a row. When users click on update button, I call an AJAX function which open a div which contains all the form fields. I have rendered a template and passed that as ajax response. However my form contain a textarea inside which html tags does get escaped e.g link would display like
http://example.com/
I have used JSON.stringify, jQuery.parseJSON before populating div and twig's raw function on form filed but no success.
My form field looks like :
{{ form_widget(form.comments,{ 'value': obj.comments|raw}, {'attr':{'style':'width:'}}) }}
I believe, it has nothing to do with JSON as the template is triggered before encoding the content but I wanted to describe the whole scenario.
Controller
$content = $this->renderView("ex.html.twig", array('form'=>$form->createView()));
return new Response(json_encode($content), 200, array("Content-Type" => "application/json"));

A simple textarea cannot display "HTML" content, so it is always going to show what you call "escaped" content, as it can only display plain text. You need to find an alternative to a textarea, like a wysiwyg editor like TinyMCE or a div with the contentEditable attribute.

use JavaScript escape function after using JSON.stringify
function stringifyP(a) {
return escape(JSON.stringify(a));
}

Related

Handlebars - Compile passed parameter (containing HTML) to template engine

I use expressjs and hbs(Handlebars) as the template engine.
One of the parameters that are passed to the template when loading the page contains HTML code.
When the page loads, instead of processing the parameter and displaying the elements, it is displayed as text.
How can I solve this?
//Server-side:
let parameter = "<h2 id="how-to-use">How To Use</h2>";
//HTML:
<div id="container">{{parameter}}</div>
//--------------------------------------
//result after page load
<h2 id="how-to-use">How To Use</h2>
//Instead of
How To Use
got it.
use the triple {{{ }}} brackets

Make fields inside a JSON response clickable (url) on a JSP page

I wish to display the JSON response returned from a REST API call "as-is" on a JSP. The problem I'm facing here is that the response is in a single line like below.
{"result":[{"enable":"true","time_stamp":"2018-01-26 19:31:37","url":"abc.xyz.com","group_id":"one"},{"enable":"false","time_stamp":"2018-01-26 19:31:37","url":"lmn.pqr.com","group_id":"two"}]}
I would like it to be displayed in a well-formatted JSON response, something like below for sorts.
{
"result":[
{
"enable":"true",
"time_stamp":"2018-01-26 19:31:37",
"url":"abc.xyz.com",
"group_id":"one"
},
{
"enable":"false",
"time_stamp":"2018-01-26 19:31:37",
"url":"lmn.pqr.com",
"group_id":"two"
}
]
}
Having said that, there are certain url ("url":"abc.xyz.com")parameters in the JSON response, which I would want to be clickable, so that users can see the JSON response dumped on the web page, but be able to click on the URL field's value to navigate to the different page.
Any idea of how this could be achieved?
Just use JSON.stringify and a HTML tag of pre
Here is a fiddle demo
or if your use AngularJs use:
<pre>{{jsonData|json}}</pre>

Prevent colon in URL from changing to %3A

Is it possible to have a colon from a form go into a link to populate a form on a new page? At the moment the link keeps changing to %3A.
For example, current: http://www.test.com/?field=123%3A456
Trying to have: current: http://www.test.com/?field=123:456
You can't.
You need to decode the parameters
for serverside php you can use
http://php.net/manual/en/function.urldecode.php
$field = urldecode($_GET['field'])
for javascript you can use
decodeURIComponent('123%3A456');

Backbone toJSON not rendering

when I use Backbone toJSON method of the model like this:
this.$el.html(this.model.toJSON());
It doesn't render model into view root element ( more than one attribute ).
But when I get one property from the model, like this;
this.$el.html(this.model.get("city"));
It is rendered properly.
Also, when I use template in first case (toJSON) - it is rendered fine.
this.$el.html(this.template(this.model.toJSON());
Why is that ?
Thanks
this.$el.html(this.model.toJSON());
You're using the html method of jQuery, which expects a string (or a DOM element, or a jQuery element), to display a JSON object.
this.$el.html(this.template(this.model.toJSON());
Here you're using a template method which, I assume, is taking a JSON object to evaluate a template that will return you a string. The htmlmethod receives this string and displays it.
this.$el.html(JSON.stringify(this.model.toJSON()));
This would display the result of this.model.toJSON() (but won't do the same as using your template method).
So, basically this.template will be (in most of the cases) a compiled version of the html template which you have for the view.
It will have placeholders in it, and will take parameters with the same key as placeholders in the template. For example (Handlebars templates),
<section id="{{id}}">
<header>{{header_text}}</header>
</section>
Considering the above code as a template, when you compile and store it in this.template, it returns a function, which takes a json object as a parameter, so now this.template is a function.
You can call it like below,
var html_text = this.template({
id : "main_content",
header_text : "Hi Welcome !!"
});
this.$el.html(html_text);
After the execution, el's contents will be
<section id="main_content">
<header>Hi Welcome !!</header>
</section>
So when you do this.$el.html(this.template(this.model.toJSON());, it actually generates the required json parameter for the this.template method for you, hence works fine.
And as Loamhoof said, in this.$el.html(this.model.get("city")); you use the html method which will set the html content of the el based on the property value of the model.

Html.BeginForm() with an absolute URL?

I need to have the POST action be to an absolute URL (e.g., http://www.cnn.com). Is there a way to use Html.BeginForm() helper and pass it the url?
BeginForm method has several overloads.
In order to set the action attribute on the form tag with the desired url, you need to use following overload of BeginForm:
BeginForm(String, String, FormMethod, IDictionary<String, Object>)
// here are the parameter names:
BeginForm(actionName, controllerName, method, htmlAttributes)
Since you want to post to an external site, there is no need to set actionName and controllerName, just leave them as null.
#Html.BeginForm(
null, null, FormMethod.Post, new {#action="http://cnn.com/post"}
)
This will not encode the action parameter.
All that the HtmlHelper.BeginForm method does is help you to create a <form> tag that targets a local controller. If you're posting to an external site, just write out the actual <form> tag, i.e.
<form action="http://www.example.com/someaction" method="post">
Actual form content in here
</form>
That's all there is to it. MVC forms are not like the forms in ASP.NET WebForms where you have a bunch of ViewState and event fields and other magical elements. They're just regular old HTML forms.
check the mvc source code, html.beginform method not only create the native html form only, but also add sth for client validation which just i want,
if (htmlHelper.ViewContext.ClientValidationEnabled)
{
htmlHelper.ViewContext.FormContext.FormId = tagBuilder.Attributes["id"];
}
so it will be a problem, i just write my own extension