Cannot resolve symbol #Url.Action - javascript

Should be a simple problem but i dont know exactly why its like this.
In my ASP.NET MVC 5 website i have a simple view with a grid, and a cell action that calls a js function sending some parameters to this function.
function OnCellClick(param1, param2) {
var urlAJAX = #Url.Action("GetJson", "PosicaoEstoque", new { p1 = param1 , p2 =param2}); }
So, like this i get the 'Cannot Resolve symbols' for the param1 and param2.
How can i solve it?

You can use placeholder. Generate url using place holder parameters and then replace them with param
function OnCellClick(param1, param2) {
var urlAJAX = '#Url.Action("GetJson", "PosicaoEstoque", new { p1 = -1 , p2 = -2})';
urlAJAX = urlAJAX.replace('-1', param1).replace('-2', param2);
}

Your problem is that you're mixing server-side and client-side code. You cannot simply put JavaScript variables in Url.Action(), as it runs on the server-side. What you can do is to put some dummy values as parameters and call JavaScript's replace() function on generated URL.
Check this for reference.

Without using Url.Action like below:
var urlAJAX = 'PosicaoEstoque/GetJson?p1=' + param1 + '&p2=' + param2;

Related

JS + Ajax + Thymeleaf - Accessing JS value from thymeleaf context

I'm wondering if there's a way to access a JavaScript object from within thymeleaf's inline syntax.
I'm trying to build a URL using the [[#{}]] syntax in JavaScript. However, inside of the URL, I need to get access to a JS variable.
Here's the code:
var fieldPathStr = /*[[#{{lessonId}/questions/{questionId}(lessonId=${lesson.id}, questionId=question.id)}]]*/"1/questions/2";
Specifically, it's the question.id that is the JS variable, but it (obviously) just creates the final URL as:
1/questions/question.id
Is there a way to structure this assignment statement so that I can get the actual value of question.id and have it evaluate it properly?
You can extract values like this:
var lessonId = [[${lesson.id}]];
var questionId = [[${question.id}]];
but I am not sure that it is a way to go. If you are working with the lists, you would need to extract them in js which means twice the work on the machine side...
There is a way to do it, but probably little different than what you thought!
An example of how I managed my popup box to confirm removal of item from the list:
<script th:inline="javascript">
function deleteObject(id) {
bootbox.confirm([[#{msg.ask}]], function(result) {
if (result) {
var url = /*[[ #{'/admin/vozila/izbrisi?vin='} ]]*/ "genericUrl";
url = url+id;
document.location = url;
}
});
};
</script>
Once this is done, all you need is to call it and pass the object id:
<a class="btn btn-default btn-sm" href="#" th:onclick="'javascript:deleteObject(\'' + ${vozilo.vin} + '\');'"><i class="glyphicon glyphicon-remove"></i><span th:text="#{rad.obr}">Radnja - izbrisi</span></a>
So you are not getting thymeleaf rendered inside js, but you pass the values to the function when called.
I guess in your case it would look something like this:
<script th:inline="javascript">
function callLink(lessonID, questionID){
var fieldPathStr = lessonID+/*[[#{'/questions/'}]]*/"1/questions/2";
var finalStr = lessonID+fieldPathStr+questionID;
};
</script>
where questionID, and lessonID should look like this:
Hope this works for you?

Accessing my Object properties from javascript and Using MVC razor Url.Action

I am mixing Javascript and Razor code to redirect to a page sending a couple params.Heres my code that I tried.
function insertSuccess(data) {
$('#NewCategoryGroup').dialog('close');
var myId = data.Object.GroupCatId;
var myName = data.Object.ItemCategoryGroup;
window.location.replace("#Url.Action("CatGroupDetails","TaxRules",new { id = myId, name = myName })");
}
I can replace Id = 1 and name = "test" and it works. But when I try to use variables it wont let me. Do I have to write my URL the old way -- "http://www.someweb.com/5?Name=test".
Thanks for the help.
I think in your code above myId and myName are javascript variables, but you are trying to use them under the C-Sharp scope. Url.Action is a C# function here.

Passing event args from javascript to code-behind while using ClientScript.GetPostBackEventReference

I'm trying to trigger a postback from java-script and also pass event args. I'm able to trigger the postback **but not able to pass event args.
The below function does not work. It does not like the args parameter in ClientScript.GetPostBackEventReference.
<script type="text/javascript">
function TriggerServerSideClick(args) {
//btnDummy is a asp.net server-side button control
<%=ClientScript.GetPostBackEventReference(btnDummy, args , true)%>
//tried this -> <%= 'ClientScript.GetPostBackEventReference
// (btnDummy,' + args + ', true)' %> ,
// but i guess i am definitely missing something.
}
</script>
What am I missing here ?
I know that the following works
__doPostBack('btnDummy', args);
but want to stay away from __doPostBack as that could change eventually and try the ClientScript.GetPostBackEventReference instead.
Thanks for your time.
#Brian: Thanks a lot for following up. I tried your placeholder approach but I am getting a javascript error. (Message: Expected ';')
Here is the viewsource snippet:
var postbackUrl = '__doPostBack('ctl00$MainContent$btnDummy','{0}')';
function TriggerServerSideClick(args) {
var url = String.format(postbackUrl, args);
eval(url);
}
Try this:
var postbackUrl = '<%=ClientScript.GetPostBackEventReference(btnDummy, "{0}", true)%>';
function TriggerServerSideClick(args) {
var url = String.format(postbackUrl, args);
eval(url);
}
Put a placeholder where the argument should be, then use a client-side method to replace the placeholder (client-side String.format method) and use that to postback.
HTH.
The answer from Brian Mains sent me in the right direction when I was working on this issue just now. The only difference being, that I didn't use the client-side string.Format - I used the mainstream JavaScript string.replace:
//js
args = someComplicatedDynamicStuff();
myPostback = <%= Page.ClientScript.GetPostBackEventReference(this, "args")
.Replace("'", "\\'") %>; // server-side replace to
// inject string delimiters
eval(myPostback.replace('args',args));

How to call inner function in jQuery?

I'm learning jQuery and saw this chunk of code.
myJqueryFile.js
(function($, undefined) {
function Calendar(element, options, eventSources) {
var t = this;
t.incrementDate = incrementDate;
....some code here
function incrementDate(years) {
if (years !== undefined) {
addYears(date, years);
}
renderView();
}
}
})(jQuery);
In my html, I am referencing the js above externally and want to call incrementDate() but I'm keep getting "increment is not function".
But I think incrementDate() is not private function so I should be able to call it from outside. Is it really possible?
I'm calling incrementDate like below:
<a href="" onclick="incrementDate();" />
Oops, I totally missed the surrounding jQuery bracket!
Yes, you can call it. You might have to call it using the apply which allows you to define this and arguments.
There is some docs here as well.
If you need some code:
var result = Calendar.prototype.incrementDate.apply(mycalendarObj, myArguments);
UPDATE
OK, it seems all you need is:
calObject.incrementDate(1,1,1); // adds one year + one month + one day
You can only call it on an instance of Calendar.
var cal = new Calendar(element, options, eventSources);
cal.incrementDate();
And Calendar is scoped to anonymous function you wrap the whole thing is. So that code can only appear inside that function (unless you do something to expose it).

Call an ActionScript function from Javascript

I want to call an Action Script function from javascript. But also I need the ActionScript function to return a value to the javascript call.
This is what I want to accomplish.
/* JS CODE */
var str = getStringFromFlash();
alert(str);
getStringFromFlash should be a function defined in ActionScript that can return a value.
On the Flash side:
ExternalInterface.addCallback("getValue", getValue);
Where getValue() is the function that returns the string.
Then on the JavaScript side:
var flashObject = document.getElementById("myFlashObject");
var str = flashObject.getValue();
alert(str);
See API documentation for the ExternalInterface class for a more complete example.
ExternalInterface.addCallback()

Categories