I have a form where the user can do a filtered search for books. the problem is that when the search results are reloaded Viewin the tabla, what the user previously typed in the input. I need that if, for example, the user writes "the little prince" as the name of the book, author: "xx" when he brings me the results, that data continues to be shown in the input.
Here the form.
@model List<Librery_MVC.Models.Libro>
@using (Html.BeginForm("userListarLibros", "Usser", FormMethod.Post))
{
<label for="exampleFormControlSelect1">Nombre de libro</label>
@*<div class="input-group inputFiltros">*@
@Html.TextBox("bookName", "", new { @class = "form-control inputFiltros", id = "txtBuscar", placeholder = "Ingrese nombre del libro", maxlength = "80" })
@*</div>*@
<div class="form-group">
<label for="exampleFormControlSelect1">Autor</label>
<select name="ddlAutor" class="form-control inputFiltros" id="exampleFormControlSelect1" onmousedown="if(this.options.length>5){this.size=5;}" onchange='this.size=0;' onblur="this.size=0;">
<option></option>
@foreach (Autor item in autorList)
{
<option [email protected]>@item.Nombre</option>
}
</select>
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">Categoria</label>
<select name="ddlCategory" class="form-control inputFiltros" id="exampleFormControlSelect1" onmousedown="if(this.options.length>5){this.size=5;}" onchange='this.size=0;' onblur="this.size=0;">
<option></option>
@foreach (Categoria item in categoryList)
{
<option [email protected]>@item.Nombre</option>
}
</select>
</div>
<div class="input-group-btn">
<button class="btn btn-default inputFiltros" value="Filtrar" type="submit">
<i class="glyphicon glyphicon-search"></i>
</button>
</div>
}And here the table where I show the results
<div class="table-responsive">
<table class="table table-striped table-primary mt-5 table-bordered" id="myTable">
<thead>
<tr>
<th></th>
<th>Id</th>
<th>Nombre</th>
<th>Autor</th>
<th>Categoria</th>
<th>Descripcion</th>
<th>Precio</th>
<th>Imagen</th>
</tr>
</thead>
<tbody>
@if (Model.Count() == 0)
{
<tr>
<td colspan="6" style="color:red">
No Match any document
</td>
</tr>
}
else
{
foreach (Libro item in Model)
{
autor = sa.getAutor(item.IdAutor);
editorial = es.GetEditorial(item.IdEditorial);
category = cs.getCategoria(item.IdCategoria);
<tr>
<th>
<input type="submit" name="btn_mostrar" value="mostrar" class="btn btn-primary" />
@Html.ActionLink("Comprar", "#", "Usser", new { idLibro = item.IdLibro }, new { @class = "btn btn-info" })
@*@Html.ActionLink("Baja", "BajaLibro", "Home", new { idLibro = item.IdLibro }, new { @class = "btn btn-danger", onclick = "return confirmation();" })*@
</th>
<th>@item.IdLibro</th>
<th class="col-md-2">@item.Nombre</th>
<th>@autor.Nombre</th>
<th>@category.Nombre</th>
<th class="col-md-3"><textarea rows="4" cols="40" readonly>@item.Descripcion</textarea></th>
<th>@item.Precio</th>
<th><img src="/@item.UrlImagen.Replace("\\", "/")" width="80" height="100" /></th>
</tr>
}
}
</tbody>
</table>
</div>this is the controller
public ActionResult userListarLibros()
{
ViewBag.Message = "Your contact page.";
ViewBag.Email = Request.Form["email"];
LibroService ls = new LibroService();//es lo mismo
AutorService sa = new AutorService();
bool hayBookName = false;
bool hayAutor = false;
bool hayCategory = false;
String consulta = "";
String bookName = Request.Form["bookName"];
String autor = Request.Form["ddlAutor"];
String cat = Request.Form["ddlCategory"];
int idAutor = 0;
int idCategory = 0;
if(bookName != null)
hayBookName = true;
if(!String.IsNullOrEmpty(autor))
{
hayAutor = true;
idAutor = Convert.ToInt32(Request.Form["ddlAutor"]);
}
if (!String.IsNullOrEmpty(cat))
{
hayCategory = true;
idCategory = Convert.ToInt32(Request.Form["ddlCategory"]);
}
// hay nombre de libro autor y categoria
if (hayBookName && hayAutor && hayCategory)
consulta = "select * from libros where nombre Like '%" + bookName + "%'" + " and idAutor = " + idAutor + " and idCategoria = " + idCategory;
//hay nombre de libro y autor pero no hay categoria
else if (hayBookName && hayAutor && hayCategory == false)
consulta = "select * from libros where nombre Like '%" + bookName + "%'" + " and idAutor = " + idAutor;
//hay nombre de libro y categoria pero no hay autor
else if (hayBookName && hayCategory && hayAutor == false)
consulta = "select * from libros where nombre Like '%" + bookName + "%'" + " and idCategoria = " + idCategory;
//hay autor y categoria pero no hay nombre de libro
else if (hayAutor && hayCategory && hayBookName == false)
consulta = "select * from libros where idAutor = " + idAutor + " and idCategoria = " + idCategory;
//si solo hay nombre de libro
else if (hayBookName && hayAutor == false && hayCategory == false)
consulta = "select * from libros where nombre Like '%" + bookName +"%'";
//si solo hay actor
else if (hayAutor && hayBookName == false && hayCategory == false)
consulta = "select * from libros where idAutor = " + idAutor;
//si solo hay categoria
else if (hayCategory && hayAutor == false && hayBookName == false)
consulta = "select * from libros idCategoria = " + idCategory;
else
consulta = "";
List<Libro> list = new List<Libro>();
//hacer uan funcvion que reciba la consulta
if (consulta == "")
{
list = ls.ListBooks();
return View(list);
}
else
{
list = ls.filtrarLibro(consulta);
return View(list);
}here the model
public class Libro
{
public int IdLibro { get; set; }
public String Nombre { get; set; }
public int AnioDeLanzamiento { get; set; }
public int IdAutor { get; set; }
public int IdCategoria { get; set; }
public int IdEditorial { get; set; }
public String Descripcion { get; set; }
public int Cantidad { get; set; }
public float Precio { get; set; }
public String UrlImagen { get; set; }
public bool Estado { get; set; }//si da error ponelo como int Mysql creo q toma False=0 y true=1
public Libro()
{
//constructor vacio
}
public Libro(int idLibro, String nombre, int anioDeLanzamiento, int idAutor, int idCategoria, int idEditorial,
String descripcion, int cantidad, float precio, String urlImagen, int estado)
{
IdLibro = idLibro;
Nombre = nombre;
AnioDeLanzamiento = anioDeLanzamiento;
IdAutor = idAutor;
IdCategoria = idCategoria;
IdEditorial = idEditorial;
Descripcion = descripcion;
Cantidad = cantidad;
Precio = precio;
UrlImagen = urlImagen;
this.Estado = Estado;
}
}
SOLVE IT THIS WAY:
to the controller code add the
ViewBagto capture what the user typed in theinputdelformulario. Here the controller:and then in the
Viewquestion if thoseViewBagare not empty, if it is true I assign the value of theViewBagto theinput. Here the oneformof theView.cshtmlI add an example, and you would only change the events of the buttons, loadData, cleanData, saveData on your page depending on whether it is a postback or not.
Due to lack of time, only storeTblValues, the implementation is finished. If you check the localStorage in your application you will see that the data is saved in json format. As a task, with only the values retrieved in setTblValues(), it adds its respective value to each column.
Now in your method you will save the data when it is a postback and when it is an initial load and if there is data, it is painted in the table.