When debugging in ASP MVC4, JavaScript will only evaluate HiddenFor once you've paused to inspect it

Struggling with evaluating a hidden field in JavaScript (ASP MVC4). I've set up a model in my View with a hidden input for one of the properties.

@Html.HiddenFor(mdl => mdl.FilterByUser, new { @id = "filterByUserId" })

Within my Helper, I have a SearchBox that triggers a search when the enter key is pressed.

$("#search-box").keydown(function (event) {
    var keypressed = event.keyCode || event.which;
    if (keypressed == 13) {
        var searchValue = $("#search-box").val();
        var filterByUser = $("#filterByUserId").val();
        debugger;

        window.location = "?searchValue=" + searchValue + "&filterByUser=" + filterByUser;

    }
});

The issue arises with the variable filterByUser, which only contains a value when the Developer Tools are on and the browser halts at the 'debugger' statement. Without the tools open, an error message stating "The parameters dictionary contains a null entry for parameter 'filterByUser' of non-nullable type 'System.Boolean'" pops up.

In contrast, the other variable, searchValue, evaluates without any problem.

Any suggestions on how to resolve this dilemma would be greatly appreciated. Thank you, Daniel

Answer №1

Aha! The issue stemmed from the helper being nested within a form element. Upon inserting a breakpoint or alert in the JavaScript keydown handler, it functioned as expected. Without this intervention, the controller action was triggered upon pressing enter in the textarea and submitting the form.

My resolution: I eliminated the JavaScript handler and reconfigured the form properties to align with those of the controller action.

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

What are the steps to switch to a root page after a successful sign-in with Ember-Auth?

After successfully implementing Ember-Auth using a pure token based approach, I am facing a challenge in redirecting users to the root of my app once they sign in. Although I know about actionRedirectable (refer to for details), since I am using a pure t ...

Obtain the PHP function output through asynchronous JavaScript and XML programming

I have a form that collects user input and saves it to the database. After submitting the form, an ajax call is made to the action.php file. e.preventDefault(); $.ajax({ type: "POST", url: "action.php", data: senData, dataType: "JSON", ...

What could be the reason why the AngularJS form is set to read-only

Explaining the setup of my app in HTML: <div ng-app="md-app"> <div id="general"> <ng-include src="template1" ng-controller="GeneralCtrl"></ng-include> </div> </div> The JavaScript function to fetch a pe ...

Wait until all information has been entered into the database before replying to the request

I have been exploring a way to insert multiple data in one call and only trigger a response after all the data has been inserted. Here is my current implementation: create: function(req, res) { var response = {}; var num = req.body.num; var re ...

Using more than one button to activate a single Material-UI Popper component

I recently found myself in a situation where I needed to activate the Material-UI <Popper /> component from various clickable elements. According to the Popper component API on the official Material-UI website, setting the anchorEl property determine ...

Swap out a particular component during the testing phase

Currently, I am running tests on my React-Redux application using Jest. Within my API calls, I have integrated a fetch module called cross-fetch. However, I am looking to substitute this with fetch-mock. Take a look at my directory structure: Action.js i ...

How to add data to Laravel after successful ajax request

I have a div containing bids: @foreach($bids as $b) <div class="bids notice notice-lg"> <strong>{{$b->user->name}}</strong> is offering <span style="font-size: 18px" class="label label-success">{{$b->bid}} €</span ...

Fetching data from local JSON file is being initiated twice

I need some help understanding why my code is downloading two copies of a locally generated JSON file. Here is the code snippet in question: function downloadJson(data, name) { let dataStr = 'data:text/json;charset=utf-8,' + encodeURICompo ...

I'm experimenting with incorporating images into a card component using the map function in JavaScript. All aspects of the card are functioning properly except for the image

import React from 'react' import Card from '@material-ui/core/Card'import CardMedia from '@material-ui/core/CardMedia'; import CardContent from '@material-ui/core/CardContent'; import {makeStyles} from '@materia ...

What is the best way to iteratively fade in data from a MySQL database one by one?

How can I load data from a MySQL database and display it one by one with a fade-in effect? Let's say I have a total of 40 images stored in the database. First, I want to display each image like this: <li class="img" style=" list-style: none; flo ...

Exploring the realm of unit testing in the NestJS CQRS architecture journey

We're currently working on writing unit tests using Jest for our application and are facing difficulties in testing sagas. Specifically, we're having trouble testing the saga itself. During our unit testing process, we've encountered an iss ...

Can a href from a "<Link>" component be passed through a Higher Order Component (HOC) into an "<a>" tag?

I am currently facing a situation with the main component where I have the following code: <Link href={'test'}> <PrimaryAnchor>Welcome</PrimaryAnchor> </Link> Within the PrimaryAnchor component, the code looks like ...

Use jQuery to display the first 5 rows of a table

I recently posted a query on show hide jquery table rows for imported xml data regarding how to toggle visibility of specific table rows using jQuery. Now, I am seeking advice on how to make the first 5 elements always visible within the same context. Belo ...

Default value for the href property in NextJS Link is provided

Is there a default href value for Next/Link that can be used, similar to the way it is done in plain HTML like this: <a href='#' ></a> I attempted to do this with Link, but it resulted in the page reloading. Leaving it empty caused a ...

Develop a feature within a standard plugin that allows users to add, remove, or refresh content easily

I have developed a simple plugin that builds tables: ; (function ($, window, document, undefined) { // Define the plugin name and default options var pluginName = "tableBuilder", defaults = { }; // Plugin constructor func ...

Making a REST call with values containing an apostrophe

Currently, I am utilizing REST and ajax to retrieve data from SharePoint using the URL below: https:xxxxxxxx/_vti_bin/ListData.svc/RMSD_Tasks?$orderby=IssueValue asc,StatusValue desc&$filter="+dropValue+" eq '"+secondFilterVal+"'&groupby ...

Disabling an HTML attribute on a button prevents the ability to click on it

In my React application, I have a button component that looks like this: <button onClick={() =>alert('hi')} disabled={true}>test</button> When I removed the disabled attribute from the browser like so: <button disabled>test& ...

Encounter issue when attempting to insert multiple items into MongoDB

// Import User and Item Models const User = require('../../models/User'); const Item = require('../../models/Item'); router .post('/login/:id', passport.authenticate('jwt', {session: false}), (req, res) => { ...

Cannot use MaterialUI Textfield/Input on iPhone devices

Recently, I encountered an issue with iPhone users being unable to type in Textfield or Input components in apps developed using MaterialUI, even when the value and setValue were properly configured. To solve this problem for each component individually, ...

The state is failing to initiate a re-render despite a change in its state

In my React application, I have encountered an issue with combining two reducers. One of the reducers is functioning properly, but the other one is not triggering a re-render after a state change. Interestingly, when I save a document or make a change in t ...