Using Radio Buttons in a jqGrid Interface

Currently, I am attempting to integrate radio buttons within a jqGrid framework. I am aware that a custom formatter can be utilized for this purpose. Below is my code snippet, however, it fails to provide information on which radio button is selected or if one is selected at all.

On all occasions, the value returned is "undefined."

// Definition of the custom formatter
function radio(value, options, rowObject){
   var radioHtml = '<input type="radio" value=' + value + ' name="radioid" />';
   return radioHtml;
}

// Excerpt from the colModel within the jqGrid definition
colModel:[
    {name:'select', label:'Select', width: 60, align:'center', edittype:'custom', 
     editable:true, formatter: radio},
    {name:'name', label: 'Source Disk Volume', width: 170}],

// Function invoked on submission
function evaluate() {
    // Attempt 1
    alert('val: '+$("[name='radioid']:checked").val()); 

    // Attempt 2
    tried to access the checked radio button using plain JavaScript 
}

I am seeking assistance in retrieving the value of the selected radio button by the user.

Answer №1

handleGridComplete: function () {
    $("td[aria-describedby=jqgridName_select] input[type='radio']").click(function () {
        alert($(this).val());
    });
}

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

Enhancing x-axis presentation in D3.js-generated charts

I created a bar chart using D3.js, but I have encountered an issue with one of the values on the x-axis being too long. I attempted to use CSS properties like text-overflow: ellipsis, width: 10px, and overflow: hidden to abbreviate values that exceed a cer ...

Forced line break at particular point in text

I would love to implement a line break right before the "+" character, either using css styling or through a different method. Is this task achievable? #myDiv{ width: 80% } #myP{ c ...

What is the reason for the error occurring in express.js?

I encountered an issue when I added this snippet of JavaScript to an HTML page being served by express.js. What could be causing the error? <script> var foo = /<%([\s\S]+?)%>/g; </script> Error: 500 SyntaxErro ...

Craft fresh items within HTTP request mapping

I am currently working on a function that subscribes to a search api. Within the map function, my goal is to transform items into objects. I haven't encountered any errors in my code, but the response always turns out empty. Here's the snippet o ...

Guide on how to automatically direct users to a page upon successful login in ReactJS

How can I redirect to the homepage after a successful login in ReactJS? Also, how can I display an error message when a user enters incorrect credentials? I have attempted the following code, but it does not successfully redirect to the homepage or show ...

I'm wondering if there is a method for me to get only the count of input fields that have the class "Calctime" and are not empty when this function is executed

Currently, I am developing an airport application that aims to track the time it takes to travel between different airports. In this context, moving from one airport to another is referred to as a Sector, and the duration of time taken for this journey is ...

Utilizing JavaScript to assign class names to dynamically created elements from objects

I specialize in javascript and am working on adding the CSS class .is-slideUp to each card__item element created from a data object, in order to achieve a sliding-up animation effect. Although the .is-slideUp class name appears in the console, it does not ...

AppleScript: Check if the value of document.getElementById is empty, then fill in the value

Hello everyone, it's my first time asking a question here. I have an AppleScript that takes values from a Numbers document and fills them into different fields of a webform using document.getElementById. Everything is working perfectly so far, but now ...

Javascript/AJAX functions properly on the homepage, but encounters issues on other pages

For a client, I have recently created 4 websites using Wordpress. Each site includes a sidebar with a script that utilizes the Google Maps API to estimate taxi fares. Strangely, the script works perfectly on the home page of each site, but fails to funct ...

Substitute HTML data attributes

Hey everyone, I'm wondering how to change a data attribute in my code. For example, I am currently using a script for a video background, but I want to replace the video with a lighter version when viewed on a mobile device. In my JavaScript file, I h ...

Modifying ID styling using JavaScript on Internet Explorer

I need to change the CSS display property from none to block using JavaScript, but only for Internet Explorer. My current code is not working for the ID #backfill-image. <script> function checkForIE() { var userAgent = navigator.userAgent; ...

What is the purpose of creating a new HTTP instance for Socket.io when we already have an existing Express server in place?

As I delve into SocketIO, I've combed through various blogs and documentation on sockets. It seems that in most cases, the standard approach involves creating an HTTP server first and then attaching the socket to it as shown below: var app = express() ...

Passport authentication leading to incorrect view redirection in Express

I'm struggling to understand why the URL is updating but leading to the incorrect view. Once a user is authenticated with passport, the URL changes to my code (/clients) but it redirects back to the homepage view. After authentication, I want the us ...

Triggering an error message when a user attempts to submit an incomplete angular form

Working on an Angular form where users advance to the next step by clicking a button, but it remains disabled until all fields are valid. I'm wondering how I can implement a custom class to highlight incomplete fields when the user tries to move to t ...

The jQuery .hasClass() function does not work properly with SVG elements

I am working with a group of SVG elements that are assigned the classes node and link. My goal is to determine whether an element contains either the node or link class when hovering over any of the SVG components. However, I am encountering an issue where ...

Exploring the shine: implementing reflection in THREE.js

Is there a way to achieve a material that reflects other shapes from the scene? I attempted to use the reflectivity property but had no success in seeing any reflection. I found an example demonstrating this effect It seems like non-standard materials we ...

What steps should I take to include a Follow - Unfollow Button on my Website?

I need to add a button on my website that allows users to either follow or unfollow a specific game. Here is the table for the follow buttons: Follow Button Table When a user clicks on the button related to the game ID, it should update the game_follow d ...

The "Go" button on iPhone triggers an error before the page is sent back

I am facing an issue with a web page that has a form containing multiple submit buttons with different functionalities like clearing the form, performing a calculation, or adding another entry line. The problem arises only on iPhone devices (tested on bot ...

Display an image when the link is hovered over within a table

I'm looking for a way to display a scanned receipt image when hovering over a link within a table. I've written some code but it's not working as expected. Can anyone help me figure out what's wrong? Here is the current state of my cod ...

Place the text (menu) adjacent to the navigation bar

I am currently using bootsrap 4 alpha 6 in combination with midnight.js to alter the color of my navigation menu toggler. I am trying to incorporate a text element (MENU) alongside it, similar to the example shown in the Capture image. For the text toggler ...