Utilizing quotation marks in ASP MVC4 when accessing Model values

I am currently working with a model in my view that includes a property named 'list of numbers'

public myModel{
 public string listOfNumber {get; set;}

Within my controller, I assign a string value to this property

public myController{
 public ActionREsult myMethod(){
  ....
  myModelObj.listOfNumber  = myModelObj.listOfNumber +"["+aNumber+"]";
  return PartialView("test/_myPartialView", myModelObj);

In my view, I have the following input element

<input type="hidden" <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ee988f829b8bd3aea69a8382c0bc8f9">[email protected]</a>(Json.Encode(Model.listOfNumber)) id="listNumb"/>

When I use console.log() to check the value of $("#listNumb").val(), I see the following result

"[1][4][3][23]"

I am puzzled by the presence of the quotation marks. Upon further investigation, I discovered that when I pass the value back to the controller using model binding, it becomes \"[1][4][3][23]\". It appears that the quotation marks have been added to the string.

EDIT

Following a suggestion from one of the answers, here is what is displayed in the view source. Interestingly, whether I include quotation marks around 

@Html.Raw(Json.Encode(Model.listOfNumber))
or not, the source output remains the same. ""[1][4][3][23]"". It seems I missed the double quotes because I did not anticipate them :)

c#javascriptasp.netasp.net-mvcasp.net-mvc-4

Answer №1

When you encode a property into a JSON object, it becomes a string with quotes around it.

Let's consider a different scenario. If you were working in JavaScript and wrote this:

var someObj = @Html.Raw(Json.Encode(someValue));

... you would expect the result to be a valid JavaScript object, right? In the case of a string value, it must have quotes around it to work correctly.

What catches my attention here is that your view code seems to lack quotation marks. I would have thought that the string should be interpreted with quotes around it. Is the Razor engine automatically adding them, or is there something different about the code you provided? Can you show me the HTML from View Source?

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can I programmatically refresh a recursive ng-include in AngularJS?

Using a recursive script within my Angular application, I am displaying a visualization of multiple objects. However, whenever I modify the structure of an object dynamically, the view does not automatically update. It appears that the ng-include directiv ...

javascriptangularjsrecursionangularjs-ng-include

Triggering an event when the cursor enters a specific div/span/a element and again when the cursor exits the element

Here's the scenario - Imagine a contenteditable element with text inside. I'm working on creating a tagging feature similar to Twitter's mention tagging when someone types '@'. As the user types, a popover appears with suggestion ...

javascriptjqueryangularjsfrontendjquery-events

Is the confirmation window not showing up on the active tab in Chrome Extension? It only seems to appear on the popup.html tab

I have created a Chrome extension for an e-gym that is designed to prompt a confirm window after every hour of using the Chrome browser. The issue I am facing is that the confirm window only appears on popup.html. I want to activate my extension so that it ...

javascripthtmlcssgoogle-chrome-extensionbootstrap-5

Is it possible to include array elements in a dropdown menu using React?

Imagine you have an array called const places = [" a1", "a2", "a3"]; and <FormControl variant="outlined" className={classes.formControl}> <InputLabel id="dropdown_label">Testing</InputL ...

javascriptarraysreactjsmaterial-ui

Creating a Directive in Vue.js to Limit Input Fields to Numeric Values

After recently diving into Vue.js, I encountered a challenge. I needed an input field that only accepted numeric numbers; any other value entered by the user should be replaced with an empty string. To achieve this functionality, I decided to create a cust ...

javascriptvue.jsvuejs2

ASP.NET index in Html.TextBoxfor tag allows for easier data binding within web

Here's a snippet of the code I'm working on: <div ng-repeat="t in getTimes(count) track by $index"> <select ng-model="genreDropDown" ng-options="genre.GenreName for genre in genres track by genre.GenreId"><option value="" label= ...

asp.netangularjs

Ensure that you do not proceed with the next step until the promise has been fulfilled

I am currently faced with a challenge in my project where I have a service that wraps a 3rd-party API to retrieve data into my controller. However, I need to perform some data processing to pivot the information before displaying it, but I am struggling to ...

javascriptangularjspromise

Node.js data querying methods and best practices for code structuring

Recently delved into the world of nodejs and still fairly new to JavaScript. In my quest for best practices, I stumbled upon this helpful resource: Currently, I am working on an application following the structure recommended in the resource. The suggesti ...

javascriptnode.jsmongodbexpressmongoose

Ways to implement a delay in a function?

I'm looking for a way to introduce a delay in my function. Should I enclose the function within a delay function, or is there a different method to ensure that the animation doesn't trigger until 5 seconds after the page has loaded? var textTo ...

javascriptjqueryhtmlcss

JavaScript Recursive Function for Generating FancyTree JSON Structure

I'm currently building an array of JSON objects for FancyTree (https://github.com/mar10/fancytree/wiki/TutorialLoadData). My JSON source is from the Jira REST service, and its structure can vary widely. Therefore, the code to construct the array of JS ...

javascriptjsonrecursionfancytree

Change the text field's border color if the field is not empty

On my website, there is a TextField where users can enter values to perform a site search. My question pertains to the border color of this field. Normally, the border color is black when the field is not in use. However, when a user clicks on the field an ...

javascriptreactjsmaterial-ui

What is the best way to invoke a function from one controller in angularjs to another controller?

I am trying to implement a solution where I need to call the Listing function of testController from userController. I have placed a marker (//) in the code snippet below to indicate where I want to make this function call. This implementation is being d ...

javascriptangularjs

How to effectively use the LIKE statement in mysql with node.js

app.post('/like/:level/:name', function(req, res){ connection.query("SELECT * from books where " + req.params.level + " like '%" + req.params.name + "'%", function(err, rows, fields) { if (!err){ var row = rows; res.send(row); console.l ...

javascriptmysqlnode.js

Display the username on a Meteor React component

I'm facing an issue with one of my React components, which serves as the main layout for my application. It includes a navigation bar that displays the username of the currently logged-in user. The problem arises when Meteor.user() returns undefined d ...

javascriptmeteorreactjs

Encountering an issue with React npm causing errors that I am unable to resolve

Hey there, I'm a newbie to React. After setting everything up, I encountered an error after running "npm start." Can anyone help me figure out how to fix this? Thanks in advance! Click here for image description ...

javascriptreactjsweb

Utilizing jQuery UI for Autocomplete Functionality with Objects

Currently, I am utilizing jQuery version 1.11.2 and attempting to implement the autocomplete widget to interpret a data array. The array consists of two individuals - Will Smith and Willem Dafoe. I anticipated that upon typing 'Wi' in the text fi ...

javascriptjqueryjquery-uijquery-ui-autocomplete

What is the reason for the absence of absolutely positioned elements in the render tree?

Recently, I came across some information about the render tree: As the DOM tree is being created, the browser simultaneously generates a separate tree known as the render tree. This tree consists of visual elements arranged in the order they will ap ...

javascripthtmlcssgoogle-chromebrowser

The most efficient method for handling a vast amount of data in NodeJS

My database consists of 4 million numbers and I need to quickly check if a specific number exists in it. Example of the database: [177,219,245,309,348,436,...] I initially tried using a MySQL table for this task, but it took a lengthy 1300ms just to chec ...

javascriptmysqlnode.jsperformancenpm

Hold tight for the response from the AngularJS factory request

In my Rails application, I am incorporating Angular. The code snippet below shows an API request being made and the code in the .run function being executed. Sometimes, the API response is still pending when the code is executed. This leads to issues with ...

javascriptruby-on-railsangularjsangularjs-directive

Protractor experiencing difficulty in adjusting price slider

As a newcomer to protractor, I am attempting to test a price slider that sorts products based on the provided price range. Unfortunately, I am facing difficulty in dragging the slider (min point) using protractor. Can anyone provide guidance on how to move ...

javascriptreactjsangularseleniumprotractor