I am using ExtJs 4.1.1 & my application is having a combobox. I have added TPL to the combobox. Everything works fine expect when the data have special characters like single quote (apostrophe). If I remove TPL application does not throw any JS error. The error occurs only in IE. I am using IE 10.
How can I ensure there is no java script error even when data is having special character.
Here is a fiddle
In your template you're using the record data in the javascript code in the onclick attribute:
onClick="Ext.PA.getController(\'MyController\').ShowSharedQueryWindow(\'{Name}\');"
When the record contains a single quote the template will produce a syntax error in that javascript code:
Ext.PA.getController('MyController').ShowSharedQueryWindow('query's');
You'll need to escape the record's attribute to prevent that:
onClick="Ext.PA.getController(\'MyController\').ShowSharedQueryWindow(\'{Name:htmlEncode:htmlEncode}\');"
The :htmlEncode is a shorthand which can be used in XTemplates to invoke functions of Ext.util.Format.
Edit: You will need to double encode it, once for the template and once again for the generated JavaScript code (see updated code above).
Fwiw, using an onclick listener in HTML generated by a XTemplate does not seem like the best approach to me. Generally I'd like to avoid adding listener via HTML when I'm working with ExtJS.
You could use an itemclick listener on the combobox's bound list instead which calls the corresponding function if the link was clicked:
combo.getPicker().on({
'itemclick': function(view, record, node, index, e) {
if (e.getTarget().tagName == 'a') {
Ext.PA.getController('MyController').ShowSharedQueryWindow(record.get('Name'));
}
}
});
That way, you'll also avoid the escaping problem.
Related
I have this HTML Entity  and I want to use it inside a <span> tag. If the HTML is directly present in the file then the icon is getting printed and things are working awesome but if I am using render function of the Vue JS:
return createElement('span', data, '');
then it is just printing the text and not the actual icon.
I have read at multiple places that HTML entity won't render directly like this but the Unicode Sequence works in such cases.
Can anyone tell me how to convert the HTML entity to its corresponding Unicode Sequence?
PS:
I can not use
domProps: {
innerHTML: ''
},
in the data parameter of createElement, or even simpler v-html as I am using weex and the resulting code is going to work on mobile devices and there DOM things do not work.
Just specify the symbol with its Unicode value
return createElement('span', data, "\ue900");
I'm trying to append a Html.ActionLink with jQuery like this
a.append("<li>#Html.ActionLink("e-TCGB","Inbox","Folder",new { Type = "1",DocumentTypeId = "3" },null)+"</li>");
and it is giving errors.
Being very inexperienced in javascript and jQuery I don't know if the error is because of wrong string parameter or because of doing something very wrong.
My guess is I'm making an escape character mistake but as I said, I don't know if what I'm doing is possible too.
'Razor is compiled at runtime - meaning its already done doing it's thing before your jQuery code is executed.
You can simply use a hyperlink though:
var li = $('<li>');
var link = $('<a href="/folder/inbox/?type=1?documenttypeid=3">e-TCGB</div>');
li.append(link);
a.append(li);
UPDATE:
Above, you can see two examples of generating elements using jQuery. The first is shorthand for generating a new <li> element:
$('<li>');
The second is generating a hyperlink tag. If you want to add attribute information you can do so in a number of different ways however I prefer to just write the tag out in long form when generating the element:
$('<a href="/folder/inbox/?type=1?documenttypeid=3">e-TCGB</div>');
#Html.ActionLink is a helper method in MVC designed to be used in the Razor views. It is executed on the server and processed as the Razor view is rendered to HTML.
jQuery is a JavaScript library that is used on the browser so execution here happens after the HTML has been received by the browser.
To recap, it is not possible to execute c# code (ActionLink) on the browser because it is a .net based server side method.
JS noob here. I'm currently using js-beautify(https://github.com/beautify-web/js-beautify) plugin to properly indent/format a long string of HTML code. This is how I'm using it
html_beautify(HTML);
HTML is a variable containing regular HTML code.
How can I pass options like disabling word-wrap or removing empty lines?
It looks like you can add an object as the second parameter to handle your options:
html_beautify(elHTML, { preserve_newlines: false, wrap_line_length: 0 });
I have a Jquery function in MVC View that check if at least one checkbox is clicked. Function is working properly if I use hardcoded string. But when I add
#Resources.myString into, it stops working, I can't figure out why
$('.form-horizontal').on('submit', function (e) {
if ($("input[type=checkbox]:checked").length === 0) {
e.preventDefault();
alert("This is working");
alert(#Resources.myString); //with this the function is not working anymore
return false;
}
});
I need to add the the string for multilingual purpose.
I tried diferent aproches
alert(#Resources.myString);
alert(#Html.Raw(Resources.myString))
var aaa = { #Html.Raw(Resources.myString)} //and calling the aaa
I think I am missing some basic knowlage of how this should work together
During page rendering, #Resources.myString will be injected as is in the code. For instance, if myString == "abc";, you'll end up with alert(abc); which is not what you want.
Just try to enclose your string in quotes:
alert("#Resources.myString");
As an aside, putting Razor code in Javascript logic is usually considered bad practice, as it prevents you from putting Javascript code in separate files (and therefore caching), and makes the code less readable.
Take a look as this question and the provided answer which gives a simple way to deal with that.
As ASP.NET dynamically generates HTML, CSS, JS code, the best way to find the error is to read the generated sources (Ctrl + U in most modern browsers).
You will see that your code
alert(#Resources.myString);
produces
alert(yourStringContent);
and should result in a console error yourStringContent is not defined.
You need to use quotes as you are working with a JavaScript string:
alert('#Resources.myString');
It will produce a correct JavaScript code like:
alert('yourStringContent');
I am using a standard page on which there is a button in which JavaScript code is written. It is calling a Controller (Class).
When I ever used click on the button,It gives me error:
A problem with the OnClick JavaScript for this button or link was encountered:
unterminated string literal.
Javascript:
try
{
alert('hi1');
}
catch(Err)
{
alert('Error in creation'+Err);
}
After searching and done some hit and trial,used a simple alert code above.
I found that. whenever i used data where there is a new line space between them i.e. data in multiple times.This error encounters no matter if you are using that particular field in JavaScript code and class or not.
I found similar problem here: unterminated string literal error in salesforce
but solution is not specified in above link.
Try wrapping SUBSTITUTE() or even URLENCODE() around the value of your long text field, then decode from JS?
Back in S-Control days I've been cheating by putting the long text values in <p id="myId" style="visibility:hidden">{!mergefield}</p> and then referencing them with getElementById...
If you're really calling your controller from JS then probably either you have control over newlines (replace them with something?) or you don't need to display whole error msg. Maybe err.details? Also - would help to use proper JS debugging tool...