Alter the color of a jstree node using JSON

My jstree is bound to JSON format retrieved from a web service. I would like to programmatically change the color of nodes.

   $("#divCourseTree").jstree({
                 'core': {
                     'data': {
                         'type': "POST",
                         "async": "true",
                         'contentType': "application/json; charset=utf-8",
                         'url': "../WebService/BranchLocation.asmx/BindCourseTreeData",
                         'data': "{}",
                         'dataType': 'JSON',
                         'data': function (node) {

                          },
                         'success': function (retvel) {
                             var r = [];
                             var data = eval("(" + retvel.d + ")");
                             for (var key in data) {
                                 if (data.hasOwnProperty(key)) {

                                     var y = data[key].id;
                                     r.push(y);
                                     $("#" + y + " a").addClass('.Selected');

                                 }
                             }

                         }

                     }
                   }
                 });

I am seeking assistance with this task. Thank you!

javascriptasp.netjsonjstree

Answer №1

var result = [];

$("#divCourseTree").jstree({
    'core': {
        'data': {
            'type': "POST",
            "async": "true",
            'contentType': "application/json; charset=utf-8",
            'url': "../WebService/BranchLocation.asmx/BindCourseTreeData",
            'data': "{}",
            'dataType': 'JSON',
            'data': function (node) {

            },
            'success': function (retVal) {

                var data = eval("(" + retVal.d + ")");
                for (var key in data) {
                    if (data.hasOwnProperty(key)) {

                        var id = data[key].id;
                        var temp = data[key].Temp;

                        if (temp == '1') {
                            result.push(id);
                        }
                        
                        //$("#" + id + " a").addClass('.Selected');
                    }
                }
            }

        }
    }
}).bind("loaded.jstree", function () {
    for (var i in result) {
        $("#" + result[i] + " >a").css("color", "green");
    }
    
}).on("open_node.jstree", function () {
    for (var i in result) {
        $("#" + result[i] + " >a").css("color", "green");
    }
});

});

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

Generating a file using buffer information in node.js

From the front-end client side, I am sending a file to the server. On the server-side, the data received looks something like this: { name: 'CV-FILIPECOSTA.pdf', data: <Buffer 25 50 44 46 2d 31 2e 35 0d 25 e2 e3 cf d3 0d 0a 31 20 30 20 6f 6 ...

javascriptnode.jsexpress

Combining letters and numbers with ASP.NET Regex

For my ASP.Net project, I am looking to create a product code format that includes a combination of 4 uppercase letters and 3 numbers. For example, A1B2C3D, ABCD123, A123BCD. Although I tried a regular expression validator, it doesn't seem to be work ...

asp.netregex

Error: The property 'field_547_raw' cannot be read because it is undefined

I've been working on code that has been functioning without issue for the past couple of years until recently after a server upgrade. The code is meant to copy student names from a roster to a new date using Visual Studios. After checking the server ...

javascriptjsonobject

The React class component is throwing an unexpected error with the keyword 'this'

I encountered an error stating "Unexpected keyword 'this'" while attempting to update the React state using Redux saga. Could someone shed light on what's wrong with the code below and how I can fix it? class Welcome extends React.Component ...

javascriptreactjsnext.js

What is the best way to implement a custom toast delay in a React application using setTimeout

The concept is straightforward: When the function showToast is called, I aim to change my toast's className to show, and then remove it by replacing with an empty string after displaying it for 3 seconds. HTML: <div id="toast">New col ...

javascriptreactjs

Achieving a multiline ellipsis (clamp) across various levels of HTML tags, compatible with popular browsers like IE and Firefox

After conducting extensive research, I finally discovered a reliable method for implementing multiple Line Ellipsis (using JS, as plain CSS is not effective). Despite exploring 100 different Google results and Q/As, this is currently the only solution that ...

javascriptcssangularjs

Display loading images using the Bxslider plugin

Currently, I have implemented a Bxslider on my website with the following HTML markup: <div class="slide"> <a target="_blank" href="#"><img src="image.jpg"/></a> </div> <div class="slide"> <a target="_blank" href= ...

javascriptjquerybxslider

Using a JSON response from a PHP request in a foreach loop: a comprehensive guide

I am currently utilizing Codeigniter and within a function, I invoke a controller to fetch data that I intend to use in a foreach loop to construct an insert statement. The JSON response received is structured as follows: { "Data": [ { ...

phpjsoncodeigniterforeach

Use jq to denote the current position within a loop

I am faced with a situation where I have two separate log files named log.json and messages.json. The log file is structured as follows: {"msg": "Service starting up!"} {"msg": "Running a job!"} {"msg": "Error detected!"} The messages file has the fol ...

jsondictionaryjq

Problem with deleting items and enabling paging in a grid view

I've tried researching but I can't figure out what's causing my issue. Here is a simplified version of my problem. I have a gridview, a checkbox to turn paging on/off, and a sql datasource with select and delete queries. When paging is ena ...

asp.netvb.net

What is the best way to identify the clicked cell?

I'm a JavaScript newbie trying to work with ExtJS 3.4. I've set up a basic tree with 3 columns and now I want to figure out which cell, row, or column has been selected. Currently, I'm following the example provided by Sencha at : var tr ...

javascriptjqueryextjs3

Adding an external JavaScript file to an HTML document by importing an array

Having trouble loading an array from an external JS file into my HTML. Snippet from js.js: var temp_max = [4,9,2,5,8,4,2,10]; In the HTML: Note: Be sure to download DateJS and place it in "DATE-JS"!! <!doctype html> <html> ... (HTML c ...

javascripthtmlarrays

Using JavaScript with namespaces in C#

I am currently trying to explore AJAX and web services through self-teaching using C# and JavaScript. After doing some research on Google, it seems like I might be facing a namespace problem. Here is the snippet of my code: using System; using System.Col ...

c#javascriptajaxweb-services

Tips for retrieving the value of a table cell when the checkbox in the corresponding row is selected

Within my project, I am utilizing a table. The html code I am using is as follows: <table id="assTB" border="1px" cellspacing="0"> <colgroup> <col style="width:15%"> <col style="width:15%"> <col sty ...

javascriptjquery

Tips for identifying the most frequently occurring value in arrays within MongoDB/Mongoose documents

Imagine a scenario where there is a collection with documents structured like this: [ { "username": "user123", "email": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="88fdfbedfac8b9b ...

javascriptnode.jsmongodbmongoose

Retrieve the keys from a JSON response using Python

Here is an example of how my JSON data could be structured: { "x":1, "y":[ { "z":2, "q":{ "r":3 }, "s":{ "t":4 ...

pythonjsonapidictionarykey

Issue with Mule Web Service Consumer failing to correctly include SOAP wrapper

Setting up a flow involves receiving a JSON payload through an HTTP endpoint, converting it into XML for a SOAP transaction, and then back to JSON. It's similar to this demo: https://www.youtube.com/watch?v=XyZcI1_MbOo. Currently, the Web Service Cons ...

jsonsoapmulecontent-typeesb

ASP.NET MVC Ajax Not Reaching Controller Action

I've been experimenting with using AJAX in ASP.Net MVC to invoke a function in my controller and pass a parameter from the model, however, I'm facing an issue. When I click the button, the controller doesn't seem to be triggered - even thoug ...

c#asp.netajaxasp.net-mvcasp.net-mvc-4

Ajax TabContainer leading to unexpected browser shutdown

Recently, I've been tackling a frustrating issue. On a page, I have an ASP.NET Ajax TabContainer that contains multiple tabs, each with a gridview control that is supposed to bind data onload. However, for some unknown reason, the browser mysteriously ...

asp.netbrowsertabcontainer

Update the href attribute when a button is clicked

Note: The buttons in the corner will not be submitting the search. The go button would still need to be clicked to submit it. Currently, I am working on a fun project during my free time at work. This project is not meant to be anything serious, but rathe ...

javascriptjqueryhtml