Enviando uma string como JSON de c # para javascript

Eu tenho algum código em JavaScript assim:

 slider.setPhotos([ { "src": "image1", "name": "n1" }, { "src": "image2", "name": "n2" }, { "src": "image3", "name": "n3" } ]); 

E eu quero definir os valores de src e name de C# .

Suponha que os valores sejam assim em C# :

 var images = new string[] {"/images/a1.jpg", "/images/a2.jpg", "/images/a3.jpg"}; var names = new string[] {"First", "Second", "Third"}; 

Como posso definir esses valores em código JavaScript (ou seja, no método de carregamento de página no código c #)?

No servidor, é necessário serializar os dados como JSON e, em seguida, você pode gravá-los na resposta como HTML usando algo como um campo de input oculto.

Por exemplo, você pode usar a biblioteca JSON NewtonSoft para serializar o JSON (que é construído no ASP MVC 4, mas é fácil de instalar usando o Nuget)

 string json = Newtonsoft.Json.JsonConvert.SerializeObject(images); 

Então, renderize o json no HTML (há vários methods para isso), por exemplo

 Response.Write(string.Concat(""); 

ou

 HiddenField jsonField = new HiddenField { ID = "data" }; jsonField.Value = json; this.Controls.Add(jsonField); 

ou até mesmo escrever diretamente como script ignorando a necessidade de analisar o cliente (ainda tenho a tendência de usar o método HTML para evitar problemas com Postbacks / Update Panels, fazendo com que o script seja executado várias vezes)

 Response.Write(string.Concat(""); 

No cliente, você pode ler esse JSON do HTML e analisá-lo. Nos navegadores modernos isso é embutido, ou você pode preencher com algo como JSON2

por exemplo

 var field = document.getElenentById('data'); var images = JSON.parse(field.value); 

Você então tem access aos dados como um object Javascript.

Assumindo que images e names sejam do mesmo tamanho Você pode usar este

 StringBuilder str = new StringBuilder(); var images = new string[] {"/images/a1.jpg", "/images/a2.jpg", "/images/a3.jpg"}; var names = new string[] {"First", "Second", "Third"}; str.AppendLine("slider.setPhotos(["); for(int i=0; i< images.Length; i++) { str.AppendLine("{ \"src\": "+ images[i] +", \"name\": "+ names[i] +" }"); str.AppendLine( (i==images.Length-1 ? "]);":",")); } Page.ClientScript.RegisterClientScriptBlock( this.GetType(), "Key007", str.ToString(), true); 

Este código irá inserir um bloco de script quando sua página será carregada e depois disso você pode usar esse bloco de script em qualquer lugar no código do lado do cliente.