Display the content as a clickable link using Jquery

Here is the view I have created using .NET MVC3:

  function DisplayingGrid () { 
  var Geo=$('#ddlGeo').val();
  var Vertical=$('#ddlVertical').val();
  var Month=$('#ddlMonth').val();
  if(Vertical=="All")
  {
  var Flag=1;
  }
  else
  {
  var Flag=2;
  }      
    $.ajax({
    url:"@Url.Action("TRUnutilizedOwnershipChange", "TravelReady")",
    datatype:"html",
    type:"post",
    data:{strGeo:Geo,strVertical:Vertical,intMonth:Month,intFlag:Flag},
    error:function(){},
    success:function(data){
    $('.travTableContent').empty();
                    var text3=data.data.lstunutilizedownershipentities;
                    for( var item in text3)
                    {
                    $('<tr />').html(text3[item]).appendTo('.travTableContent');
                    $('<td />').html(text3[item].CurrentOwnership).appendTo('.travTableContent');
                    $('<td />').html(text3[item].cnt).appendTo('.travTableContent');                        
                    }                        
      }     
    }); 
  }

I am looking to retrieve the count value from this specific line:

$('<td />').html(text3[item].cnt).appendTo('.travTableContent'); 

If I want to style this as a link, what CSS properties can be applied to $('<td />') for achieving that effect?

Answer №1

Here is a suggestion for your code:

$('<td />').html('<a href="#your-link">' + text3[item].cnt + '</a>').appendTo('.travTableContent'); 

Additionally, you can update the code by passing text3[item].CurrentOwnership as an argument to the GetDetail() function.

$('<td />').html('<a href="#" onclick="GetDetail(\'' + text3[item].CurrentOwnership + '\');">' + text3[item].cnt + '</a>').appendTo('.travTableContent');

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 steps can I take to prevent ng-bootstrap modal from automatically centering the content within the modal?

Looking for a solution to a UX issue with my Angular ng-bootstrap modal. The problem arises when displaying messages of varying lengths - if the message is longer than the screen's vertical resolution, it gets centered on the screen. This causes incon ...

Ensuring the Safety of Usernames with JavaScript, PHP, and MySQL

I have come across several articles discussing the implementation of a feature on a registration page that automatically checks if a username is already in use in the database. However, I am concerned about the security implications of this approach. I fea ...

What is the process for incorporating a no-refresh submission using a hyperlink instead of a button?

Below are a few links that will trigger actions to insert data into different databases once clicked: <a href="#">insert into database1</a> <a href="#">insert into database2</a> <a href="#">insert into database3</a> Th ...

How can I make the lines of my drawer thicker in Material UI?

Currently, I'm in the process of implementing a left-side navigation bar for a web application I'm developing. The main challenge I'm facing is customizing the styles as desired when using the Drawer component. Specifically, I'm aiming ...

The issue with the <Button> component not properly linking in next.js

Having trouble with a button wrapped inside a custom Navbar component. The code snippet in question is: <NavBtn> <Link href="/contact" passHref> <Button> Contact Me </Button> </Link> & ...

Secure your static site from CSRF attacks: here's how!

I have a unique situation where my static website is hosted on a CDN and interacts with an API through AJAX. How can I defend against CSRF attacks in this setup? Given that I don't have the ability to produce a CSRF token when the static site loads, ...

Real-time charting with JQuery without using comet technology

Are there options for implementing real-time ajax charts with jQuery without requiring a comet server setup? I've come across plugins that promise real-time functionality but ultimately rely on setTimeout(). What are your thoughts on this? I'm l ...

JMeter encountered a 500 Internal server error while trying to call the API

Hey everyone, has anyone encountered a 500 internal server error when trying to call an API? I have developed an application that retrieves data from an API. I am currently conducting performance testing on this functionality using JMeter. To perform the ...

Leverage jQuery/JS to divide a lone <ul> element into four distinct <ul> lists

I'm working with a dynamically generated single list (<ul>) that can have anywhere between 8 and 25 items (<li>'s). Here's an example of the HTML structure: <ul id="genList"> <li>one</li> <li>two</l ...

Modifying the display toggle functions

How can I toggle between a button and an input type "file" when clicked? I am using jQuery to show and hide elements, but I need help changing back to the button when clicking somewhere else on the page. HTML: Upload<input type="button" id="upload" /& ...

Utilizing a WSDL in ASP.NET Web API: A Step-by-Step Guide

Can you please verify if the idea behind my question is clear? I currently have a WSDL file from an existing web service that is locally hosted. My goal is to create a Web API to encapsulate this web service, allowing me to easily make RESTful AJAX calls. ...

Unable to Validate Ajax Form if Enclosed within <form> Elements

Could you please take a moment to review this link and help me understand why I am unable to validate the form when it is enclosed within a <form> ... </form> tag? Upon examining the code, I noticed that validation works fine when the form is ...

The combination of Google Maps and CSS transforms causes a blur effect on the page

After implementing the CSS Transform technique to center a div both horizontally and vertically, the desired effect was achieved. However, an unexpected issue arose on pages that contained a Google Maps iframe causing the entire page to go blurry. To view ...

What is the best way to transfer information from a client to a server using Meteor?

I am currently developing an application and have encountered an issue. I have an HTML page located in the './public' folder. Within the './public/js' directory, there is a script that gathers data after a form is submitted on this page ...

What are some ways to maintain code efficiency when working with AJAX requests?

Looking at the code below, I am making two identical Ajax requests with only one line of difference. Is there a way to consolidate this into a function to maintain DRY (Don't Repeat Yourself) code? $('.searchable').multiSelect({ selecta ...

The static files for the icon CSS (404 Error) from Flaticon and Font-mfizz are failing to load properly

When I was designing a website, I needed an icon of Python, so I turned to Flaticon and found what I was looking for. This snippet shows the HTML code I used: {% load static %} <!DOCTYPE html> <html lang="en"> <head> <li ...

Poorly positioned text displayed inline in HTML

My attempt to place a title in a div toolbar next to some images has hit a snag. The text is not aligning correctly; it should be positioned at the top of the toolbar, but it stubbornly remains at the bottom without budging. I wish for it to be vertically ...

A comprehensive guide on how to find keywords within an array and then proceed to make all text within the parent div tag stand

I am currently looking for a webpage that displays a list of products based on keywords from an array. Once it detects any word in the array, it highlights it with a red background - everything is working smoothly so far. However, I now wish for the script ...

The ion-item is refusing to be centered on the page

I'm having trouble centering an ion-item and it seems slightly off-center. The standard methods like text-align: center and adjusting padding in ion-content don't seem to be working for me. Can someone please assist? https://i.stack.imgur.com/QZ ...

Utilizing jQuery for seamless transitions between multiple background images

Looking to create a dynamic page using jQuery that alternates between different large background images for a fading effect. How can I achieve this? ...