I am currently working with entity framework and ajax, I have a method in ajax that returns a list that I can load in a table and when I want to choose some item in particular I click on the row and this data loads them in form, general I charge them in TextBoxFor:
@Html.TextBoxFor(model => model.SubjectId, new { @class = "form-control", @required = "Required", @id = "SubjectTxt", @style = "visibility:hidden" })
The problem is that the function that I have in javascript to load this function makes it perfectly for numbers but when the data are characters or string type I see this error, in this case Lectoescritura is the content of the variable I want pass:
Create:1 Uncaught ReferenceError: Lectoescritura is not defined
at HTMLInputElement.onclick
The onclick method that goes to the function is:
"<input type='button' onclick='PasarMateria(" + value.SubjectId + "," + value.NameSubject + " )' class='btn btn-warning' value='Seleccionar' data-dismiss='modal'>"
and the function in javascript:
function PasarMateria(SubjectId, NameSubject) {
$("#SubjectTxt").val(SubjectId);
$("#SubjectLbn").val(NameSubject);
console.log(SubjectId);
}
the complete ajax method
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
$(document).ready(function () {
$("#SearchSubjectBtn").click(function () {
alert("se dio click en el boton");
var SearchBySubject = $("#SearchBySubject").val();
var SearchSubject = $("#SearchSubject").val();
var SetDataSubject = $("#DataSearchingSubject");
$.ajax({
type: "POST",
url: "/Generic/GetSubject?SearchBy=" + SearchBySubject + "&SearchValue=" + SearchSubject,
contentType: "html",
success: function (result) {
console.log(result);
if (result.length == 0) {
window.alert("no se encontro la materia");
SetDataSubject.append('<tr style="color:red"><td colspan="3">No se encontro la materia</td></tr>')
}
else {
$.each(result, function (i, value) {
var Data = "<tr>" +
"<td>" + value.NameSubject + "</td>" +
"<td>" + value.NameLevel + "</td>" +
"<td>" +
"<input type='button' onclick='PasarMateria(" + value.SubjectId + ",'" + value.NameSubject + "' )' class='btn btn-warning' value='Seleccionar' data-dismiss='modal'>" +
"</td>" +
"</tr>";
SetDataSubject.append(Data);
});
}
}
});
});
});
function PasarUsuario(UserId, nombre) {
$("#txtUsuario").val(UserId);
$("#borrartxt").val(nombre);
document.getElementById('borrartxt').innerHTML = nombre;
console.log(UserId);
}
function PasarMateria(SubjectId, NameSubject) {
console.log('SubjectId', typeof SubjectId);
console.log('NameSubject', typeof NameSubject);
$("#SubjectTxt").val(SubjectId);
$("#SubjectLbn").val(NameSubject);
console.log(SubjectId);
}
</script>
}
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
$(document).ready(function () {
$("#SearchSubjectBtn").click(function () {
alert("se dio click en el boton");
var SearchBySubject = $("#SearchBySubject").val();
var SearchSubject = $("#SearchSubject").val();
var SetDataSubject = $("#DataSearchingSubject");
$.ajax({
type: "POST",
url: "/Generic/GetSubject?SearchBy=" + SearchBySubject + "&SearchValue=" + SearchSubject,
contentType: "html",
success: function (result) {
console.log(result);
if (result.length == 0) {
window.alert("no se encontro la materia");
SetDataSubject.append('<tr style="color:red"><td colspan="3">No se encontro la materia</td></tr>')
}
else {
$.each(result, function (i, value) {
var Data = "<tr>" +
"<td>" + value.NameSubject + "</td>" +
"<td>" + value.NameLevel + "</td>" +
"<td>" +
"<input type='button' onclick='PasarMateria(" + value.SubjectId + ",'" + value.NameSubject + "' )' class='btn btn-warning' value='Seleccionar' data-dismiss='modal'>" +
"</td>" +
"</tr>";
SetDataSubject.append(Data);
});
}
}
});
});
});
function PasarUsuario(UserId, nombre) {
$("#txtUsuario").val(UserId);
$("#borrartxt").val(nombre);
document.getElementById('borrartxt').innerHTML = nombre;
console.log(UserId);
}
function PasarMateria(SubjectId, NameSubject) {
$("#SubjectTxt").val(SubjectId);
$("#SubjectLbn").val(NameSubject);
console.log(SubjectId);
}
</script>
}
Here I want to put what I find
<div class="container">
<div class="panel panel-default">
<div class="panel-heading">
<h3>Buscar Materia</h3>
</div>
<div class="panel-body">
<div class="form-inline">
@Html.TextBoxFor(model => model.SubjectId, new { @class = "form-control", @required = "Required", @id = "SubjectTxt", @style = "visibility:hidden" })
<label id="SubjectLbn">Materia no relacionada</label>
</div>
</div>
</div>
</div>
What has me confused is because I get an error when the result I give to NameSubject is string type and not when it is integer and if I must declare NameSubject of type string as I do, I understand that javascript is flexible with the variable type theme.
Thanks