How to concat #Url.Action with jquery syntax - javascript

I'm using bootstrap datatables to create a column displaying a link button to redirect to another view, the problem is that I'm getting syntax error from jquery and I'm not beign successful fixing it.
Here is the relevant part where I get the syntax error:
return '<button type="button"class="btn btn-default" onclick="location.href='#Url.Action("IncidentesDetalle", "ServiciosController", new { Id = "1" })'"><i class="fa fa-eye"></i></button>'
Any help will be appreciated.

I guess you should change your string to:
return '<button type="button" class="btn btn-default" onclick="location.href=\'#Url.Action("IncidentesDetalle", "ServiciosController", new { Id = "1" })\'"><i class="fa fa-eye"></i></button>'
Because in your original code single quotes just closed after href= and opened before ><i again. So part of the returning string like #Url.... became just invalid code. Hence the error.

Try this, it will work:
string path = "'#Url.Action('IncidentesDetalle', 'ServiciosController', new { Id = '1' })'";
return "<button type='button' class='btn btn-default' onclick='location.href="+path+"'><i class='fa fa-eye'></i></button>";

Related

Undefined error when passing row.entity and col.field to function

I need row.entity and col.field to determine if a button needs to be disabled or not, so here's the code for the cellTemplate of my UI-grid
cellTemplate:
'<div *ngIf="{{COL_FIELD}}"> '+
'<div class="ui-grid-cell-contents" > {{COL_FIELD}}' +
'<button uib-tooltip="Modifica" tooltip-placement="auto" ng-disabled="grid.appScope.modificaDisabled(row.entity, col.field)"'+
'rel= "{{row.entity}}" rol="{{col.field}}" '+
'class="btn btn-xs btn-primary stretto" style="float:right;" edit>'+
'<i class="fa fa-pencil fa-fw"></i>'+
'</button>'+
'</div>'+
'</div>'
and here's the function called
var modificaDisabled = function(riga,col){
console.log(riga)
console.log(col)
//disabling logic
}
The problem ( sgrid.appScope.modificaDisabled(row.entity, col.field) ) is that the second parameter passed (in this case col.field) results undefined but if i switch their position (col.field, row.entity ) col.field is actually defined but then row.entity results undefined.
Can anyone help me? I've seen another post talking about the spacing after the comma, but nothing seems to work
I eventually found a "solution" :
ng-disabled="grid.appScope.modificaDisabled([row.entity, col.field])"
by passing the values as an array I get them defined (idk why) and i can finally proceed

Passing the parameter via an automatically generated JavaScript link to the controller

I have a problem with passing the parameter via the link to the controller. The view in which I have a problem is to dynamically display the list of users, along with the possibility of searching for them. I did this part in js and it works fine. In this functionality in js I generate a link to the buttons, so that later, after pressing the button, you can save the selection in the database. Each link has an assigned user ID and user group ID. My problem is that when I press the button, nothing happens.
The following code represents the functionality described above. I would be very grateful for your help.
#if(ViewData[Enums.States.UserSelectWindow.ToString()].ToString() == "True")
{
<script type="text/javascript">
$("#UserlistCollectionId").css('height', $("#WindowUserSelectId").height() + 'px');
let users = #Html.Raw(Json.Serialize(UserModel.GetUsers()));
function Clear() {
$("#UserlistCollectionId").empty();
}
function FillAll(users) {
Clear();
for (user of users) {
$("#UserlistCollectionId").append('<li class="list-group-item"><div class="row justify-content-between"><div class="col-auto">' + user.name + '</div><div class="col-auto"><a class="btn btn-sm btn-success" asp-action="AddUserToGroup" asp-controller="Settings" asp-route-groupId=#Model.Group.Id asp-route-userId='+user.id+'>Wybierz</a></div></div></li>');
}
}
FillAll(users);
$("#SearchInputId").keyup(function () {
Clear();
let searchValue = $("#SearchInputId").val();
if (searchValue === "")
FillAll(users);
else {
for (user of users) {
if (user.name.includes(searchValue)) {
$("#UserlistCollectionId").append('<li class="list-group-item"><div class="row justify-content-between"><div class="col-auto">' + user.name + '</div><div class="col-auto"><a class="btn btn-sm btn-success" asp-route-groupId=#Model.Group.Id asp-route-userId='+user.id+'>Wybierz</a></div></div></li>');
}
}
}
});
</script>
}
In the above code, automatic link generation is performed using JQuery as follows:
$("#UserlistCollectionId").append('<li class="list-group-item"><div class="row justify-content-between"><div class="col-auto">' + user.name + '</div><div class="col-auto"><a class="btn btn-sm btn-success" asp-route-groupId=#Model.Group.Id asp-route-userId='+user.id+'>Wybierz</a></div></div></li>');
Unfortunately it doesn't work. In the inspection of the page you can see that the tag "a" does not have the attribute "href", only automatically puts all the code in quotes:
Screen of the html fragment in the browser
Firstly, you need read the doc about what does asp-route-{value} generate the url:
Any value occupying the {value} placeholder is interpreted as a potential route parameter. If a default route isn't found, this route prefix is appended to the generated href attribute as a request parameter and value
(/home/index?value=aaa). Otherwise, it's substituted in the route template. More explantion you could refer to the document.
Secondly, you do not specify the controller and action name, so the url will generate depending on your request url. That is to say, if the tag helper exists in Home/Privacy.cshtml, it will generate to:href="/home/privacy?value=aa".
Finally, Tag Helpers are interpreted. In other words, Razor must see them as actual tags in order to replace them. So what you did in js will not follow the tag helper generation principle, it's just a JS string. You need change the url like below:
<a class="btn btn-sm btn-success" href="/home/index?groupId=' +#Model.Group.Id+'&userId=' + user.id+'">Wybierz</a>
If the url matches the default route template, the url may like below:
<a class="btn btn-sm btn-success" href="/home/index/' +#Model.Group.Id+'/' + user.id+'">Wybierz</a>

Call laravel route inside javascript

Is there a way to call a Laravel route (with ID) inside a javascript?
Right now I'm getting encoded results and I'm stuck with this. I appreciate any help!. TY
I have this redirect link inside a javascript. This href is inside a datatable, once I click an icon it will redirect me to the page.
return `<a href = "{{ route('smshistory.view', ['id' => $smshistory->id]) }}" class="btn btn-link btn-success btn-just-icon btn-round" title="SMS History">
<i class="material-icons">sms</i>
<div class="ripple-container"></div>
</a>`;
My route:
Route::get('sms-history/{id}', 'SmsHistoryController#getView')->name('smshistory');
My controller:
public function getView($id) {
$smshistory = SmsOutboundsHistory::find($id);
return view('sms-history', compact('smshistory'));
}
I'm getting an encoded results for this:
http://127.0.0.1:8000/%7B%7B%20route('smshistory.view',%20['id'%20=%3E%20$smshistory-%3Eid])%20%7D%7D
I would like to have it like this. The URL + id
http://127.0.0.1:8000/sms-history/2

SyntaxError: missing ) after argument list in cart.js

I'm getting
SyntaxError: missing ) after argument list | in cart.js file
// Purchase button.
add('<button onclick="yaCounter44762137.reachGoal('zakaz'); return true;" class="btn btn-primary cart-purchase-button" type="button"></button>')
If you escape the single quotes like this:
add('<button onclick="yaCounter44762137.reachGoal(\'zakaz\'); return true;" class="btn btn-primary cart-purchase-button" type="button"></button>');
It'll work.
Or you can change the zakaz in double quotes. It would make things a lot easier to do.
add('<button onclick="yaCounter44762137.reachGoal("zakaz"); return true;" class="btn btn-primary cart-purchase-button" type="button"></button>');
Or you can even use one double quote and put everything else in a single quote:
add("<button onclick=yaCounter44762137.reachGoal('zakaz'); return true;' class='btn btn-primary cart-purchase-button' type='button'></button>");

How to add variable to a href

I want to do something like this
var myname = req.session.name; <------- dynamic
<a href="/upload?name=" + myname class="btn btn-info btn-md">
But this does not work. So how do I properly pass in a dynamic variable to href? <a href="/upload?name=" + req.session.name class="btn btn-info btn-md"> does not work either
Actually there's no way to add a js variable strictly inside DOM. I would suggest you to apply an id attribute to that a element, refer to it and apply given variable as a new href attribute.
var elem = document.getElementById('a'),
myname = 'req.session.name'; //used it as a string, just for test cases
elem.href += myname;
console.log(elem.href);
<a id='a' href="/upload?name=" class="btn btn-info btn-md">Link</a>

Categories