What is the method for transferring a script-defined variable to a division tag in an ASP.NET MVC5 Razor view?

I am looking to pass the value of the target from a script to a division tag in MVC. Below are the codes I have implemented.

Script:

@section Scripts{
    <script type="text/javascript">
            $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
                var target = $(e.target).attr("link") // activated tab
                alert(target);
            });
    </script>
}

DIV: (outer division)

<div class="ibox-title">
                    <h5><i class="fa fa-newspaper-o"></i> &nbsp; News &amp; Events</h5>
                    <div class="ibox-tools">
                        <a href="@Url.Action("List","News")" style="color: #00a650;font-weight:600;">View All</a>
                    </div>
                </div>

I simply want the value of the target to be displayed inside this division.

Moreover, in the line where it says: News in @URl.Action("List","News") should be replaced by the value of the target.

javascriptc#asp.netasp.net-mvcbootstrap-4

Answer №1

Assign an id to the div and then utilize jQuery.append for adding the following HTML:

<div id="Target">
..
..
<b> target </b>
</div>

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

Tips for ensuring that a THREE.Group is always displayed in front of other objects

I am attempting to display a set of transform controls in such a way that they are constantly visible to the user. However, when I disable DepthWrite or apply the AlwaysDepth function to the transform controls, I achieve the desired result but encounter an ...

javascriptthree.js

Dividing the array into distinct subarray groups

I am working with a JavaScript array that contains strings, like this: let a = ["a", "a", "a", "b", "c", "c", "b", "b", "b", "d", "d", "e&quo ...

javascriptarrayssortinggrouping

What are some solutions for troubleshooting a rapid-moving Selenium web driver?

My code is not functioning correctly and I need a better solution. The fast speed of execution makes it difficult for me to detect where the issue lies. Below is my current code: public static void main(String[] args) { //**************************** ...

javascriptseleniumselenium-webdriver

Manipulating the DOM in AngularJS Directives without relying on jQuery's help

Let's dive right in. Imagine this as my specific instruction: appDirectives.directive('myDirective', function () { return{ restrict: 'A', templateUrl: 'directives/template.html', link: functio ...

javascriptjqueryhtmlcssangularjs

Spontaneously generating models

Explaining this concept can be a bit complex. I am tasked with creating an object that contains properties from dynamic HTML code. To illustrate, let's use an example: Firstly, here is my data object: var myObject = {Field1: 'Value1', Fiel ...

javascriptvue.js

Viewstate Error caused by Firewall or Proxy Truncation

Our production environment has been encountering numerous errors that are not replicable in our DEV environment for our asp.net webforms application: We are receiving the following error: "The input is not a valid Base-64 string as it contains a non-base ...

c#asp.netproxyfirewallviewstate

Using Linq to establish relationships with values through a foreign key

I created a webpage and site with the help of Linq. The webpage has a gridview that displays information about different customers and is connected to a List (Of Customer). To retrieve data for a single customer, I use the code snippet below: Public ...

c#asp.netsqlvb.netlinq-to-sql

Autocomplete feature enhanced with the ability to validate and clear out

Here's a snippet of my HTML code: <div class="form-group"> <label for="date_chargement" class="col-sm-4 control-label">Minimum loading date:</label> <div class="col-sm-2"> <input type="text" class="form-control te ...

javascriptjqueryhtmldatepicker

Efficiently Organizing Data Using Coldfusion Loops in Columns and Rows

My issue lies in pulling data from a database to display on my website. I have three keys/attributes (columns) - PostedDate, DataImage, and Source that need to be shown together in one div with the posted date at the top, image in the middle, and source at ...

javascriptmysqlcsssqlcoldfusion

I must eliminate any rows in a table that do not include the specified [string]

I have a task to remove specific rows from a table that do not contain a certain string. $(document).ready(function() { var str = "b"; $("#mytable tr td:not(:contains(str))").parent().remove(); }); //this approach is not produci ...

javascriptjquery

Is there a way to transform a JavaScript array into a 'name' within the name/value pair of a JSON object?

Suppose I have a dynamic array with an unspecified length, but two specific values are given for this array. var arrName = ["firstName","lastName"]; I need to create a JSON variable that includes the exact values provided for this dynamic array. Here are ...

javascriptarraysajaxjson

Strategies for concealing and revealing content within dynamically loaded AJAX data

I am attempting to show and hide data that is loaded using Ajax. $.ajax({ type: "POST", url: "/swip.php", data: {pid:sldnxtpst,sldnu:sldnu}, success: function(result) { $('.swip').prepend(result); } }); This data gets ...

javascriptjqueryhtmlajax

What is the method to track the number of tspan elements within each span element?

How can I use jQuery to count the tspan elements inside multiple span elements within svg text? var count_tspan = jQuery('span text').children().length; // 4 console.log(count_tspan); <div class="content-inner"> <span id="item-0" cl ...

javascriptjquerydom

The connection between MongoClient and Express has been established successfully, however, an error occcurred: TypeError: Cannot read the property 'collection' of null

I am currently working with the MongoClient instead of mongoose, but I am facing an issue where I can't seem to set a new collection in my routes file. db/index.js const {MongoClient} = require('mongodb'); const MONGO_DB_NAME = 'mooo ...

javascriptnode.jsmongodbexpress

Error encountered: Unable to access properties of an undefined element, specifically 'keyboard'

Why am I encountering this issue? I am checking the carousel.js file. _addEventListeners() { if (this._config.keyboard) { EventHandler.on(this._element, EVENT_KEYDOWN, event => this._keydown(event)) } } ...

javascriptwordpress-themingcarouselbootstrap-5

Why am I experiencing a problem with my ajax call only working once when I submit forms that are rendered with @Html.Render

I have a scenario where my index page loads with two partial views, each containing an ajax call that filters content based on date. The issue I'm facing is that the ajax call only works once successfully, and subsequent attempts cause a full page ref ...

javascriptjqueryajaxasp.net-mvcasp.net-mvc-partialview

I'm curious about something as a beginner. Can you explain what **.config.js and **.vue.js files are? How do they differ from regular .js files

I have a simple question that I haven't been able to find the answer to through searching. I've come across files like vue.config.js generated by vue-cli, as well as files like Content.vue.js. At first, I assumed that after the period was the fi ...

javascriptvue.js

Dismiss Bootstrap by clicking anywhere

I have a specific input that is displayed when clicked and disappears with the next click: <a href="#;" class="asset_info" data-asset_id="{{ asset.pk }}" data-toggle="focus" tabindex="0" data-placement="left" data-trigger="focus" >Hello</a> ...

javascriptjquerytwitter-bootstrap

Understanding the error handling in Express.js

Learning about error handling in express is new to me and I have a straightforward piece of code like this - const express = require('express'); const MongoClient = require('mongodb').MongoClient; const app = express(); let url = &a ...

javascriptnode.jsexpresserror-handling

Display a sublist when a list item is clicked

I am receiving a JSON object in my view that looks like this: $scope.mockData = [ { "folder": "folder1", "reports": [{ "name": "report1" }, { "name": "report2" }, { "name": "report3" }] }, { "folder": "folder2", "reports": [{ "name": ...

javascriptangularjsjson