Pass along the value of a link upon clicking on it

I have implemented a simple list using md-data-table:

<tr md-row md-select="device" md-on-select="logItem" md-auto-select="options.autoSelect" ng-repeat="device in devices.data">
<td md-cell style='text-align:left;vertical-align:middle'>{{device.ID}}</td>
</tr>

My objective is to write code that allows me to click on an entry in the list and be directed to another site/state/view where the controller can retrieve the value, like device.ID, and generate a view with data related to that device.ID.

While I considered using php post/get method, it's not feasible due to project requirements.

javascriptangularjsdatatable

Answer №1

Ensure to include a ng-click attribute that triggers a function to store the device.ID in a $rootScope variable:

<td md-cell><a href="" ng-click="storeDeviceID(device.ID)">{{device.ID}}</a></td>

The storeDeviceID function in your controller may look similar to this:

$scope.storeDeviceID = function(deviceID){
  $state.go('i_liveDevice');
  $rootScope.liveDevice=deviceID 
};

Remember to inject the dependencies $rootScope and $state into your controller.

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

Incorporating an HTML/Javascript game into a reactJS website: A step-by-step

After developing a game using plain javascript and HTML along with a few JS libraries, I find myself inquiring about the process of integrating this game into my ReactJS website. Typically, the game is initiated by opening the index.html file located with ...

javascripthtmlreactjs

Angular - Brilliant time selection tool (BTS) The TimePicker feature fails to automatically switch to selecting minutes after choosing the hour

I'm currently implementing the Amazing time picker in my app and I'm facing an issue where it doesn't automatically switch to minutes after selecting the hour. component.html <input type="time" atp-time-picker formControlName="time" cla ...

javascripthtmlarraysjsonangular

What are the steps to validate an Ajax form using Dojo JavaScript?

Currently, I am in the process of validating a form that has been written in Javascript/Dojo before sending it via Ajax. Here is the code snippet: <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js" type="text/javascript" djConf ...

javascriptajaxdojovalidation

Actively toggle the selection state within OpenSeadragon

Currently, I am in the process of integrating a viewer for scanned pages using OpenSeadragon along with the Selection plugin (https://github.com/picturae/openseadragonselection) to allow users to select a portion of the page. I have successfully incorpora ...

javascriptangularjsopenseadragon

Validating decimals in a text field with either JavaScript or jQuery

I need to implement text field validation on the keyup event. The text field should only accept money type decimals such as: (12.23) (.23) (0.26) (5.09) (6.00) If any incorrect value is entered, it should revert back to the previous value and remove the ...

javascriptjquery

Is it considered good or bad practice to use plain JavaScript objects in an AngularJS application?

Imagine needing a custom object that doesn't rely on AngularJS (such as a specific collection with unique functionalities). You could create it independently of AngularJS and simply use it in services/controllers. Alternatively, you could design it a ...

javascriptangularjs

Dealing with numerous promises simultaneously using AngularJS Factory

I have created a code that makes multiple $http calls recursively and saves all the promises it returns in an array. Then, I resolve all of them and save the responses in another array. Now, my question is: How can I efficiently return this final array to ...

javascriptangularjsfactoryqangular-promise

Display hierarchical JSON data in an Angular table

I'm attempting to display nested data from JSON in a table, but I'm having trouble achieving success. My JSON data:- $scope.data = [ { "$id": "1", "Folder": [ { "Name": "Windows-Desktop", "CPU": "2", ...

arraysangularjsjsonhtml-table

What is the best way to eliminate "?" from the URL while transferring data through the link component in next.js?

One method I am utilizing to pass data through link components looks like this: <div> {data.map((myData) => ( <h2> <Link href={{ pathname: `/${myData.title}`, query: { ...

javascriptreactjsnext.js

Modifying the key of a JSON object can result in the alteration of other associated values as well

Overview: A JSON Object var JSON_OBJECT = []; has been defined as a global variable. [ { "user_id": "123", "AF": [ { "formula_type": 0, "lag": 0 } ], "Trend": [ { "is_active": 0 ...

javascriptjqueryjsonkey-value

Having trouble retrieving data from the database when passing input to a mongoose query using an href tag in Node.js

Welcome to My Schema const AutomationSchema=new mongoose.Schema( {EventName:String, EventDate:String, EventLocation:String, EventDetails:String } ) The Events Model const EventsModel=new mongoose.model("Events",AutomationSchema ...

javascriptnode.jsmongodbexpressmongoose

Organizing Angular Material Styles using Namespacing

In an attempt to develop reusable components with Angular 1.4.3 and Angular-Material 1.0.5, the goal is to seamlessly integrate these components across various applications. However, a challenge arises as the Angular Material CSS contains styling rules th ...

javascriptcssangularjsangular-material

Does IE 9 support endless local storage capacity?

I recently updated my HTML5 persistent storage (localStorage) capacity testing to address a memory exception issue in the previous version. I even created a jsFiddle showcasing it: http://jsfiddle.net/rxTkZ/4/ The testing code involves a loop: var val ...

javascripthtmlinternet-explorer-9local-storage

Retrieving an Object from an Object Group in javascript

I am encountering an issue while looping through something. https://i.sstatic.net/JkqcP.png However, I'm facing difficulties in obtaining the [["PromiseValue"]] object. If anyone can assist me with this, I would greatly appreciate it. Update : Th ...

javascriptjqueryarraysjson

Using JavaScript to transform radio buttons into checkboxes

I have a grouping of radio buttons and a checkbox displayed on the page as shown below <html> <head> <title>Languages</title> <script type="text/javascript"> </script> </head> <body> <spa ...

javascriptcheckboxradio-button

Transfer the values from identical textboxes to jQuery, and subsequently to a PHP page for saving them to a database

Here is a list of textboxes that I have: ` <table id="div1" style="width:100%;"> <tr> <td> <label>Question Text</label> </td> <td colspan="5"> ...

javascriptphpjquery

Getting started with html2canvas: A beginner's guide

So here's a seemingly simple question... I'm diving into new territory and stumbled upon http://html2canvas.hertzen.com with a straightforward tutorial. After successfully running the command npm install -g html2canvas, I hit a roadblock. Where e ...

javascripthtmlangularnpmhtml2canvas

Using backslashes to escape JSON values within a value in Angular

When retrieving JSON data from the backend, I often encounter an issue where the value is set to "key": "\$hello" and it results in an "Unexpected token d". Is there a way in Angular to handle or escape these characters once received from the server? ...

javascriptangularjs

Ways to enhance the value of an option within a drop-down menu in angular js 1.x and retrieve the selected value

Can someone help me convert this jQuery code to AngularJS 1.x? <select id="select"> <option value="1" data-foo="dogs">this</option> <option value="2" data-foo="cats">that</option> <option value="3" data-foo="gerbil ...

javascriptjqueryangularjs

Utilize React-markdown to interpret subscript text in markdown format

I tried to create subscript text in an .md file using the following syntax: x_i x~i~ Unfortunately, react-markdown did not interpret this as subscript. After some research, I discovered the package remark-sub-super and implemented it with the plugin ...

javascriptnode.jsreactjsnext.jsreact-markdown