We Keep Coding

How to display viewbag on view on HttpPost

I want to be able to display the ViewBag on view on button click event, this is my code:
[HttpPost]
public ActionResult SpecificWorkflowReport(Report2ListViewModel wf)
{
var getSpRecord = db.Mworkflow().ToList();
var getRecord = (from u in getSpRecord
select new Report2ListViewModel
{
WorkFlowType = u.WorkFlowType,
WorkflowInstanceId = u.WorkflowInst,
WorkFlowDescription = u.WorkFlowDesc,
}).ToList();
ViewBag.WorkflowType = wf.WorkFlowType;
ViewBag.WorkflowInstanceId = wf.WorkflowInst;
ViewBag.WorkFlowDescription = wf.WorkFlowDesc
var data = Newtonsoft.Json.JsonConvert.SerializeObject(getRecord);
return Json(data);
}
i have tried this:
Worflow Type: #ViewBag.WorkflowType
Workflow Instance Id: #ViewBag.WorkflowInstanceId
Workflow Description: #ViewBag.WorkFlowDescription
My Javascript and json Call:
<script type="text/javascript">
$(function () {
var table = $("#reportTable").DataTable();
var url = $("#frmSpecificWorkflowReport").attr('action');
var str = $("#frmSpecificWorkflowReport").serialize();
$.ajax({
url: url,
type: "POST",
data: str,
cache: false,
dataType: "json",
success: function (_data) {
if (_data.f !== undefined) {
swal({
title: "Empty Result Set",
text: "No record found",
type: "info"
});
table.clear();
return false;
}
var arr = $.map(JSON.parse(_data), function (el) { return el
});
if (arr.length === 0) {
swal({
title: "Empty Result Set",
text: "No record found",
type: "info"
});
}
table.clear();
table.destroy();
$('#reportTable').dataTable({
data: arr,
columns: [
{ "data": "WorkFlowType" },
{ "data": "WorkflowInstanceId" },
{ "data": "WorkFlowDescription" },
],
dom: 'Bfrtip',
buttons: [
'copy', 'csv', 'excel',
{
extend: 'pdfHtml5',
orientation: 'landscape',
pageSize: 'LEGAL'
}
]
});
table = $("#reportTable").DataTable();
but the ViewBag values are always null on the view, any assistance will be appreciated. I just added Javascript and json call to the post, i want to be able to retrieve my stored data and display it anywhere on the view

#UwakPeter your code snippets is ok, but you are returning Json, may be you are calling this method via javascript, so the view is not updating, you need to reload the view, by the submit button.
If you are using javascript, you can pass your data list and model data as anonymous object, so that you don't need to use ViewBag. in client side by ajax success function you can grab them (WorkflowType, WorkflowInstanceId, WorkFlowDescription, Result)
[HttpPost]
public ActionResult SpecificWorkflowReport(Report2ListViewModel wf)
{
var getSpRecord = db.Mworkflow().ToList();
var getRecord = (from u in getSpRecord
select new Report2ListViewModel
{
WorkFlowType = u.WorkFlowType,
WorkflowInstanceId = u.WorkflowInst,
WorkFlowDescription = u.WorkFlowDesc,
}).ToList();
var data = Newtonsoft.Json.JsonConvert.SerializeObject(getRecord);
return Json(new{
WorkflowType = wf.WorkFlowType,
WorkflowInstanceId = wf.WorkflowInst,
WorkFlowDescription = wf.WorkFlowDesc,
Result= data
}, JsonRequestBehaviour.AllowGet);
}
JS
$.ajax({
url: url,
type: "POST",
data: str,
cache: false,
dataType: "json",
success: function (_data) {
var workflowType=_data.WorkflowType; //set it to HTML control
var workflowInstanceId =_data.WorkflowInstanceId;
var workFlowDescription = _data.WorkFlowDescription;
$('#reportTable').dataTable({
data: _data.Result
});
}
)};

Try this,
#{
Layout = null;
ProjectMVC.Models.Record record= (ProjectMVC.Models.Record)ViewBag.Recorddetails;
}
...
Worflow Type: #record.WorkflowType

Not able to access JSON datas

I am trying to loop through the JSON object and create an input type dynamically in a div
here is the Jquery function
$(document).ready(function (){
$.ajax({
type: "POST",
url: "Tables.aspx/TotaTable",
contentType: "application/json; charset=utf-8",
dataType:'JSON',
success: function(data) {
//var data= $.parseJSON(data);
$.each(data,function(index,jsonobj)
{
alert(jsonobj.OTID);
}
);
}
});
});
Here is the server side code that return the JSON values
I am using json.net framework to convert my datatable to JSON
[System.Web.Services.WebMethod(EnableSession=true)]
public static string TotaTable()
{
LoginData lData = (LoginData)HttpContext.Current.Session["LData"];
ClsDataAccess cData = new ClsDataAccess();
DataTable dt = cData.GetTable("Select otid,ottableno from FBOUTLETTABLES where otoutletid=1");
string val=JsonConvert.SerializeObject(dt).ToString();
return val;
}
here is the JSON value that is sent to the client side
[{"OTID":76.0,"OTTABLENO":222.0},{"OTID":3.0,"OTTABLENO":3.0},{"OTID":4.0,"OTTABLENO":4.0},{"OTID":5.0,"OTTABLENO":5.0},{"OTID":6.0,"OTTABLENO":6.0},{"OTID":7.0,"OTTABLENO":7.0},{"OTID":8.0,"OTTABLENO":8.0},{"OTID":9.0,"OTTABLENO":9.0},{"OTID":2.0,"OTTABLENO":2.0},{"OTID":1.0,"OTTABLENO":1.0}]
My problem is
alert(jsonobj.OTID);
shows 'undefined'
I did try changing the server side function to return a List
like
public static List<Tables> Tables()
{
List<Tables> myList=new List<Tables>();
//Code to get datas from the database
foreach(DataRow row in dt.Rows)
{
myList.Add(new Tables{
tabID=row["tabID"].ToString();
tables=row["tab"].ToString();
});
}
return myList;
}
but I am facing the same issue..

Finally Got It working
Here is the Jquery Code
var obj={};
obj.ID=id;
$.ajax({
type:"POST",
url:"Tables.aspx/ItemsFromCategory",
data: JSON.stringify(obj),
contentType: "application/json; charset=utf-8",
dataType:'json'
}).done(function(res) {
var resultAsJson = res.d;
$.each(resultAsJson, function (index, resObject) {
alert(resObject.ID);
});
}
});
I did also change the server side code to this
public static List<ItemClass> ItemsFromCategory(string ID)
{
LoginData lData = (LoginData)HttpContext.Current.Session["LData"];
System.Web.Script.Serialization.JavaScriptSerializer ser = new System.Web.Script.Serialization.JavaScriptSerializer();
List<ItemClass> myList = new List<ItemClass>();
if (lData != null)
{
ClsDataAccess cData = new ClsDataAccess();
DataTable dt = cData.GetTable("Select itmid,ITMNAME from FBITEMDETAILS where itmtype='I' and itmisprimary='N' and itmoutletid=" + lData.fbOutLetid + " and itmgrpid=" + ID);
// DataTable dt = cData.GetTable("Select itmid,ITMNAME from FBITEMDETAILS where itmtype='I' and itmisprimary='N' and itmgrpid=" + ID);
foreach (DataRow row in dt.Rows)
{
myList.Add(new ItemClass
{
ID = row["itmid"].ToString(),
itemName=row["ITMNAME"].ToString(),
});
}
// result = ser.Serialize(myList);
// return result;
return myList;
}
// return string.Empty;
return myList;
}

Sending object to a controller in asp.net mvc using ajax

I have issue with sending object contains array to a controller
this is my js code
var messageId = 0;
function DraftMessage()
{
var to = [];
var i = 0;
$('#to option:selected').each(function (index, element) {
to[i++] = $(element).val();
});
console.log(to);
$.ajax({
type: "POST",
url: "#Url.Action("DraftMessage", "Activities")",
datatype: "json",
traditional: true,
async: false,
data: { "id": messageId, "To": to, "Title": $("#title").val(), "Project": $("#project").val(), "AreaId": $("#areaId").val(), "Body": $("#messageBody").val() },
beforeSend: function () { }
}).done(function (Id) {
console.log(Id);
messageId = Id;
});
}
$("input, select, textarea").change(function () { DraftMessage(); });
var contents = $('.note-editable').html();
$(".compose-message").on("blur", ".note-editable", function () {
if (contents != $(this).html()) {
DraftMessage();
contents = $(this).html();
}
});
and this is my controller side
public int DraftMessage(message draftMessage, HttpPostedFileBase[] files = null)
{
return new MessageActions().DraftMessage(draftMessage);
}
my issue is that the ajax request always send the to array as null, I do not know what is wrong so could anyone help me to resolve this issue.

Can you change your request and use
dataType: "json",
contentType: "application/json;charset=utf-8",
This should work. Please let me know.

Try this. Push your object to array and send it as Json.
array.push({yourobject datas here})
$.ajax({
type: "POST",
url: '/DraftMessage/Activities',
contentType: 'application/json',
data: JSON.stringify(array),
success: function (d) {
..
},
error: function (xhr, textStatus, errorThrown) {
console.log(errorThrown);
}
});
Convert your controller function's return type to JSonResult.
Hope helps.

do you want upload file using ajax ?!!
use the normal usage of form not the Ajax.BeginForm then in form submit event
write your code like this:
$('#Form').submit(function () {
var xhr = new XMLHttpRequest();
var fd = new FormData();
var file = $('#Image').val();
if (file) {
var fname = $('#Image')[0].files[0].name;
if (CheckFile(file)) {
var uploadFile = document.getElementById('Image').files[0];
var myArray = [];
myArray.push(uploadFile);
if (myArray.length > 0) {
for (var i = 0; i < myArray.length; i = i + 1) {
fd.append("File1", myArray[i]);
}
}
}
else {
return false;
}
}
fd.append("ID", messageId);
fd.append("Title", $('#Title').val());
fd.append("Project", $('#Project').val());
fd.append("AreaId", $('#AreaId').val());
fd.append("Body", $('#messageBody').val());
var form = $('#Form');
var token = $('input[name="__RequestVerificationToken"]', form).val();
fd.append("__RequestVerificationToken", token);
xhr.open("POST", "/ControllerName/Action/", true);
xhr.send(fd);
xhr.addEventListener("load", function (event) {
if (event.target.response != "OK") {
OnFail(event.target.response);
}
else {
OnSuccess(event);
}
}, false);
return false;
})
server side in controller:
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult actionName(Model pModel){
HttpPostedFileBase File = Request.Files["File1"];
if (File != null && File.ContentLength != 0){
//do what you want
return Content("OK");
}
else{
Response.StatusCode = (int)System.Net.HttpStatusCode.BadRequest;
return Content("Error Messages", System.Net.Mime.MediaTypeNames.Text.Plain);
}
}

You can try a different approach. You can serialize your entire form by doing something like this:
var formdata = $("#frmEmailInfo").serialize();
and then post it to the Controller:
$.ajax(
{
type: "POST",
data: formdata,
dataType: 'json',...

ajax call serialize and deserialize data

I have the following ajax call:
$(document).ready(function() {
$.ajax({
type: "POST",
url: "/LoadCount.aspx/GetCounts",
contentType: "application/json; charset=utf-8",
data: "",
async: false,
dataType: "json",
success: function(data) {
var myObj = JSON.parse(data.d);
alert(myObj.length);
for (var i = 0; i < myObj.length; i++) {
alert(myObj[0]);
}
},
error: function(xhr, status, error) {
var err = eval("(" + xhr.responseText + ")");
alert(err.Message);
}
});
});
I am getting undefined when I alert the length
Here's my Method in my LoadCount.aspx
[WebMethod]
public static string ObtenerContador()
{
List<MenuItem> menu =(List<MenuItem>)HttpContext.Current.Session["MenuItems"];
Dictionary<string, int> dic = new Dictionary<string, int>();
foreach (MenuItemAMostrar item in menu)
{
dic.Add(item.ControlID,1);
};
return new JavaScriptSerializer().Serialize(dic); //or any other suggested serialization method
}
this is what I am getting in the success function:
{"MenuCLESAAsignar":1,"MenuOCGestores":1,"MenuOcAAutorizar":1,"MenuOcAAutorizarBanco":1,"MenuOCGestoresObservadas":1,"MenuCLESActivos":1,"MenuParametros":1,"MenuCLESConAddendaAAprobarSup":1,"MenuPendienteAprobacion":1,"MenuConsultaCLES":1}
The question is, how do I deserialize that dictionary in my ajax success function?
Once deserialized, how do I populate it, obtaining the data?
thanks!

As somebody else mentioned, you just use JSON.parse() to parse the data.
From there it just creates an object, and you can access the data with ..
Like so:
http://jsfiddle.net/SJGLF/1/
var myData = JSON.parse(jsonData);
for(var i in myData)
{
console.log(i + " = " + myData[i]);
}

Are you looking for this?
success: function (data)
{
var myObj = JSON.parse(data.d);
},

Pass Dictionary<String,List<String>> to Javascript array

This is my web service
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public Dictionary<string,List<string>> GetCategorias()
{
var diccionario = new Dictionary<string, List<string>>();
var categoria = "Recursos Humanos";
diccionario.Add(categoria,new List<string>());
diccionario[categoria].Add("Busqueda de recursos");
diccionario[categoria].Add("Busqueda de recursos humanos");
var categoria1 = "Informatica";
diccionario.Add(categoria1, new List<string>());
diccionario[categoria1].Add("IT");
diccionario[categoria1].Add("Departamento de Insfractructura");
//var serializer = new JavaScriptSerializer();
//string json = serializer.Serialize((object)diccionario);
return diccionario;
}
I received the dictionary in Javascript as:
function get_Categorias_Comunidades() {
$.ajax({
type: "POST",
url: "Lista_Categoria_comunidad.asmx/GetCategorias",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: llamada_Webservice,
error: llamada_Error
});
}
function llamada_Webservice(peticion) {
debugger;
}
How do I parse the keys and values to an array?

Something like this
function llamada_Webservice(peticion) {
var categories = peticion;
for(item in categories{ // Data is saved in the variable named d if it's ASP.NET WebService
var categoria = item; // The name
var list = categories[item]; // The array that you could loop thru
}
}