jQuery

17K

Solutions

5K

Contributors

jQuery (Core) is a cross-browser JavaScript library that provides abstractions for common client-side tasks such as Document Object Model (DOM) traversal, DOM manipulation, event handling, animation and Ajax. jQuery also provides a platform to create plugins that extend jQuery's capabilities beyond those already provided by the library.

Share tech news, updates, or what's on your mind.

Sign up to Post

i use the javascript code below. but I want to have comma and dollar sign like e.g. $3,079,095.75
do you know how to code it?

parseFloat(Math.round(data[index].totaldueamount * 100) / 100).toFixed(2)
0
CompTIA Network+
LVL 13
CompTIA Network+

Prepare for the CompTIA Network+ exam by learning how to troubleshoot, configure, and manage both wired and wireless networks.

Hello ,

I am trying to use the jquery  DataTable  like below but it gives  error like ,so please suggest thanks.
Cannot read property 'length' of undefined


======================================================          
       
$('#example').DataTable( {
    ajax: {
        url: 'http://localhost/Student/user',
        dataSrc: "data"
     
    },
    columns: [
    { data: 'StudentId' },
    { data: 'CategoryName' },
    { data: 'LocationId' }
   
       
    ]
});

=====================================================

JSON Data

{
    "data": [
        {
            "StudentId": "James N",
            "CategoryName": "Class 2",
            "LocationId": 1
           
        }
    ]
}

=================================================

Error:

Uncaught TypeError: Cannot read property 'length' of undefined
 
 
 at datatables.js:4755
    at callback (datatables.js:3876)
   
at Object.success (datatables.js:3906)
    at j (jquery-2.1.3.min.js:2)
   
at Object.fireWith [as resolveWith] (jquery-2.1.3.min.js:2)
   
at x (jquery-2.1.3.min.js:4)
    at XMLHttpRequest.<anonymous> (jquery-2.1.3.min.js:4)

===================================================
0
Hello ,
 I TEST it with WEB API using POSTMAN it give DATA as empty : Please suggest.

API URL:
http://localhost/school/Student/getStudentList

Result
{
    "Message": "Data Received successfully",
    "Status": true,
    "Data": [ ]
}

Open in new window



Below is the code pattern i am trying :

Models
public class Student
{
    public int StudentId { get; set; }
    public string ClassName { get; set; }
    public int LocationId { get; set; }
}

public class ResponseModel
{
    public string Message { set; get; }
    public bool Status { set; get; }
    public object Data { set; get; }
}

Open in new window


Service Method
public ResponseModel LoadStudents (SqlCommand comm)
{
    ResponseModel _objResponseModel = new ResponseModel ();
    List<Student> students = new List<Student> ();
    Student rls = new Student ();
    comm.CommandText = "Select StudentId,ClassName,LocationId from Students";
    SqlDataReader dr = comm.ExecuteReader ();

    while (dr.Read ())
    {
        rls.StudentId = dr.GetInt32 (0);
        rls.ClassName = dr.GetString (1);
        rls.LocationId = dr.GetInt32 (2);

        students.Add (rls);
    }

    dr.Close ();

    _objResponseModel.Data = students;
    _objResponseModel.Status = true;
    _objResponseModel.Message = "Data Received successfully";

    return _objResponseModel;
}

Open in new window


Action
[Route ("school/Student/getStudentList")]
[HttpGet]
public HttpResponseMessage GetStudentList ()
{
    UserRectification rtg = new UserRectification ();
    ResponseModel _objResponseModel = new ResponseModel ();
    HttpResponseMessage msg;

    try
    {
        _objResponseModel = LoadStudents (comm);
        msg = Request.CreateResponse (HttpStatusCode.OK, _objResponseModel);
    }
    catch (InvalidOperationException ioe)
    {
        msg = Request.CreateResponse (HttpStatusCode.BadRequest, ioe.Message);
    }
    catch (Exception ex)
    {
        msg = Request.CreateResponse (HttpStatusCode.InternalServerError, ex.Message);
    }
    finally
    {

    }

    return msg;
}

Open in new window

0
Hello!

I'm having a problem with this page: https://www.benknier.com/skills.html 

The page used to load and display properly, but within the last couple of weeks it has stopped working altogether. It seems to flash the content and then disappear. All of the other pages on the site work properly and I haven't been able to pinpoint the issue by looking at what's in the console. I've attached a copy of the source code to this post.skills.html

Any help you can give me in getting this working properly will be greatly appreciated!

Thank you in advance.
0
I'm a non-programmer (i.e., designer) using JQuery Mobile 1.2.1 (I know this is old, in the process of updating). When a visitor arrives at a particular static page via an outside link that includes a #hash at the end of the URL (i.e., "my-site.com/mypage.html#target", #target being a section inside a collapsible), I need a collapsible on that page to expand, then I need the page to scroll smoothly to the target of the hash.

At the moment, this is a very specific use case, where I know the exact section and the target I want to scroll to, but it would be nice if this code could be reusable for any external link coming to a page where I would like to scroll to any target that's inside any collapsible. At this point, I'd settle for anything that works, as this is a somewhat urgent request.

I'm able to accomplish this sort of thing when just navigating to targets within a page via click, but when arriving from outside the page/site via a hash link URL, the results are very random and somewhat unpredictable. The collapsible opens, and then either the page scrolls to the target then immediately resets to view to the top of the page, or the scroll lands off target by varying margins. Kinda maddening.

This is where I've arrived most recently before throwing up my hands and running here.

$(window).bind("load", function() {
    	var hashName = window.location.hash;
//because I know the specific hash, I put it in an if statement to keep it from possibly interfering 

Open in new window

0
<p>	bullet point bug test</p><ul><li>	</li><li>		1	</li><li>		2	</li><li>		3	</li><li>		4	</li><li>		5</li></ul>

Open in new window



so i have a string from CKEDTIOR ,

it keeps adding in blank bullet points,

is their a way to remove the <li> </li> if it has no value inside it ?

for example keep the li with 1 , 2 ,3 but remove the first one which is blank ?
0
I'm making a semi-simple chat client.

I'm using CryptoJS to encrypt a string, then JQuery to send that string to a web handler, and storing that in SQL

... then attempting to retrieve the string, and decrypt it.

It works...sometimes, not all the time.  I assumed it has something to do with string encoding and escaping URI.. or I'm doing something wrong in the encrypt() and decrypt() methods.  Now I seem to be going backward in success rate.

I can't figure out why it wouldn't just work all the time, or not at all.
When I use alert(encryptedmessage), and alert(messagetodecrypt) ....both strings appear to match perfectly, which adds to the mystery.

Any ideas??


<!DOCTYPE html>
<html>
<head>
    <title></title>
	<meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />

    <script type="text/javascript" src="/Scripts/jquery-min.1.9.0.js"></script>

    <script type="text/javascript" src="/Scripts/aes.js"></script>


    <script>
        var channelid = "nullchat";
        var key = "public";
        var keySize = 256;
        var ivSize = 128;
        var iterations = 100;

        
        window.onunload = SetInt();

        function SetInt() {
            window.setInterval(GetID, 2500);
        };

        function channelset(val) {
            channelid = val;
        };

        function keyset(val) {
            key = val;
        };

        function post(val) {

      

Open in new window

0
I would normally just echo out the search results using php when doing an Ajax search but this time I am trying to use a json response instead. For seem reason I am getting duplicate results like:

result 1
result 2
result 1
result 2

when it should just be

result 1
result 2

DB Query:

    public static function searchContacts($searchText)
    {
        $searchTerm = "%{$searchText}%";
        
        $db = static::getDB();
        $stmt = $db->prepare("SELECT `id`, `first_name` FROM `contacts` WHERE `first_name` LIKE ?");
        $stmt->execute([$searchTerm]);
        return $stmt->fetchAll(PDO::FETCH_CLASS, get_called_class());
    }

Open in new window


Controller:

    public function search()
    {
        if ($_SERVER['REQUEST_METHOD'] === 'POST') {
            
            $response = [];
            
            $searchText = trim($_POST['searchText']);
            
            $searchResults = Contact::searchContacts($searchText);
            $response['results'] = $searchResults;
            
            echo json_encode($response);
            
        }
    }

Open in new window


jQuery/Ajax

    $('#search').keyup(function () {
        var searchText = $('#search').val();
        if (searchText.length > 3) {
            $.ajax({
                    url: url + '/Contacts/search',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        searchText: searchText
                    }
                })

                .done(function (data) {

                    $.each(data.results, function (index, item) {
                        $('.search-results').append("<a href=' " + url + '/contacts/' + item.id + " '>" + item.first_name + "</a>" + "<br>").show();
                    });
                })

                .fail(function (jqXHR, textStatus, errorThrown) {
                    console.log(textStatus + ': ' + errorThrown);
                    console.warn(jqXHR.responseText);
                });
        } else {
            $('.search-results').hide();
        }
    });

Open in new window

0
Here's my code:

<div id="helper" style="display:none;"></div>
<input id="ord_reviewOrder_submit" type="button" class="btn_base btn_green_60" value="Submit" onclick="$('#ord_reviewOrderError').slideUp().html('');
       if($('#ord_deliveryMethod').val().length == 0 || $('#ord_deliveryCost').val().length == 0)
       var amount = $('#helper').val();
       $('#ord_reviewOrderError').append('A delivery method must be selected to process the order.<br/>');
       [b]$('#ord_reviewOrderError').append('$('#helper).val()');[/b]

Open in new window


What you're looking at is a part of a page that I'm being asked to troubleshoot.

The solution I'm trying to engineer will be looking for the value the API is going to be putting in the "helper" div.

Ultimately, I want to be able to evaluate that value, but for now I'm just trying to reproduce it and I can't get it to show up in the line that I have in bold.

There's no error, but there's no value either.

When I look at the source code, I can see this:

[code]<div id="helper">1000</div>

But I won't see "1000" in the "ord_reviewOrderError" div which is located toward the bottom of the page.

No error, but no value.

What am I missing?
0
I am hoping this is an easy solution that I am just overcomplicating.

1) I have JSON data stored in a hidden div
2) I want to parse that JSON data for a particular record and get a specific value (code) from the record.
3) I want to use a URL parameter called id to filter for that specific JSON record and get the code from the data.
4) below is the code I started putting together but I can't see to successfully figure out how the parse the JSON data for the record I need.
 
//URL Parametercode
$(document).ready(function() {
if (getParameterByName('id') != '') {
 
//use ID To get course code
var courseid = getParameterByName('id');
console.log(courseid);

var courseJSONDdata = $("#coursedata").text();
console.log('THIS IS A TEST' + $("#coursedata").text());

//filter by Paramter ID
function filter(courseJSONdata, courseid) {
           var result = [];
           if (courseid)
               result = courseJSONdata.filter(function (item) { return item.dataid == courseid });
           return result;
       }
       
console.log('RESULT TEST ' + result);

///Load the Data for the Course after Parameter
   LoadQuestions(coursecode, $("#answers").text());
   LoadData(coursecode, $("#coursedata").text());
   }
   }
);

function getParameterByName(name) {
  var res = new RegExp(
      // Parameter names always start after a ? or &.
      '[\?&]' +

      // Make sure any [ or ] are escaped in the name.
      name.replace(/\[/g, '\\\[').replace(/\]/g, '\\\]') +

   

Open in new window

0
Introduction to R
LVL 13
Introduction to R

R is considered the predominant language for data scientist and statisticians. Learn how to use R for your own data science projects.

I am dealing with an SAAS application that generates html pages that use css

Only some of this css is open for "configuration" (i.e. that I can change)

I have a need to hide a delete button - but I  am NOT a css guru

I want to hide/disable ONLY THIS button:
<button xmlns:urlencoder="java:java.net.URLEncoder" 
xmlns:stringext="java:com.niku.union.xsl.StringExt" 
type="button" onclick="submitForm('page_XXXList','odf.deleteObjectInstancesConfirm','odf_sub_object_code=XXX','odf_is_sub_object=true','odf_cncrt_parent_id=5000002','odf_parent_id=5000002','parentObjectCode=ZZZ','ui.page.space=odf.ZZZList','partition_code=NIKU.ROOT');" 
style="  " 
class="ppm_button ">
<img src="ui/uitk/images/s.gif" class="caui-ndeCheckmark" alt="Delete" title="Delete" border="0" align="absmiddle">
&nbsp;Delete
</button>

Open in new window

NOTE this string ,'odf_sub_object_code=XXX'  makes this button unique i.e. the odf_sub_object_code value XXX is relevant (I think)

How might hiding this button be possible?

ps. the CSS is large, if you need snippets from it please let me know what bits are needed.
0
Can you reference a asp tag that is passed in variable.  I have a table  that contains rows which
contain asp id's example aspTagName = txtFirstName,  fielRequired = false

I want to look at the column fieldRequired and based on value of false
remove the attribute required from the asp page using the value of
the aspTagName(txtFirstName)

Please advise.

Thanks in advance
0
Hi, on https://magickitchen.com, there's a console error.

jquery.min.js:4 Uncaught TypeError: a.indexOf is not a function
    at r.fn.init.r.fn.load (jquery.min.js:4)
    at plugins.min.js:2
    at plugins.min.js:2

All I can find is that it could be a problem with the version of jquery (we are using https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js), or that there's some code using load, unload or error. I can't find any code doing that.

Can anyone tell me where I can fix this error? Thanks!
0
this is a follow on to the question at
https://www.experts-exchange.com/questions/29138630/JQuery-If-Test-Not-Working.html?headerLink=workspace_open_questions

Open in new window


I need the cookie to be deleted when they close the browser or submit the order.   This is the code I have to delete the cookie but it isn't going away for either reason.

jQuery('#cook').click(function(e) {
		e.preventDefault();
		document.cookie = "wantmembership=1; path=/";
document.cookie = 'wantmembership=;expires=Thu, 01 Jan 1970 00:00:01 GMT;';
          jQuery(this).css('background-color','green');
              jQuery(this).text("I Now Have A Membership!");
			});

Open in new window

0
Hi experts,

I have a question regard to sending data with PHP curl POST, GET vs jquery or javascript ajax request with post and get. Are there any differences in using one over the other as in securely passing data between client and server? I see most examples were dealing with ajax request by sending data over to the server with either GET or POST and obtain data in json instead of using curl to perform this task.  Thanks!
0
I have a jQuery DataTable with columns added for filtering. I'm trying to figure out how to get the select drop-downs to update to match the visible rows whenever the table is filtered on some other row.
The DataTable is setup like this:
<table id="TrainingSchedule" style="width:95%" >   
    <thead>   
        <tr class="filterrow">
            <th><select class="filterSelect" id="filter_Day_0"></select></th>               
            <th><input class='filterInput' id="filter_Date_1" /></th> 
            <th><input class='filterInput' id="filter_StartTime_2" /></th> 
            <th><input class='filterInput' id="filter_EndTime_3"  /></th>  
            <th><input class='filterInput' id="filter_Title_4" /></th> 
            <th><select  class="filterSelect" id="filter_Location_5"></select</th>
            <th><input class='filterInput' id="filter_Room_6" /></th> 
            <th><input class='filterInput' id="filter_Course_7"   /></th>  
            <th><input class='filterInput' id="filter_CourseNumber_8"  /></th>  
            <th><input class='filterInput' id="filter_SectionNumber_9"  type="text" /></th>  
            <th><select class="filterSelect" id="filter_Instructor_10"></select></th>
            <th><select class="filterSelect"  id="filter_Type_11"></select></th>
            <th><select class="filterSelect" id="filter_Ignore_12"></select></th>             
            <th><input class='filterInput' id="filter_DateAdded_13"  /></th>  
        </tr>      
    

Open in new window

0
Screen-Shot-2019-03-22-at-15.18.32.png
so the image is my message editor which i am using ckeditor to create templates,

this text is wrapped in paragraph tags ,

the text within the curly brackets refers to a property,

so when you insert this template on a users profile those id within the curly brackets displayed their info so in this image first name and last name,

is their s way i can read these id within the curly brackets ? im using php
0
I am getting
IE11 throwing “SCRIPT1014: invalid character”  for the below line of code

`<div class="comment">
                <div class="${originClass}">
                    <p>${comment}</p>
                    <date><b>${sender}</b> ${date} <fromDB><divstyle= "visibility: hidden; width: 0px;">${fromDB}</div></fromDB></date>
                              
                </div>
            </div>`

looks like the issue is with "`". it works ok on chrome and firefox but IE seems to be having some issues with it.
0
Good Evening Everyone

I am trying to do a registration MODAL to post using php and get back a confirmation result, I have it working in the normal submission method POST using php, which passes the variables and reloads the page to registration.php after submission.

This is the MODAL below :
           <!--Body-->
                    <div class="modal-body">
                        <form method="POST" action="/registration.php">
                      <div class="md-form form-sm mb-5">
                        <i class="fas fa-user prefix" style="color: dodgerblue "></i>
                          <input class="form-control" id="fname" name="fname" type="text" placeholder="&nbsp First Name"><br>
                      </div>

                      <div class="md-form form-sm mb-5">
                        <i class="prefix"></i>
                          <input class="form-control" id="lname" name="lname" type="text"  placeholder="Last Name"><br>
                      </div>

                      <div class="md-form form-sm mb-4">
                        <i class="fas fa-address-book prefix"></i>
                          <input class="form-control" id="address" name="address" type="text"  placeholder="Address"><br>
                      </div>
                        <div class="container">
                        <div class="form-check-inline">
                            <label class="form-check-label">
                                <input type="radio" 

Open in new window

0
OWASP: Threats Fundamentals
LVL 13
OWASP: Threats Fundamentals

Learn the top ten threats that are present in modern web-application development and how to protect your business from them.

Hello,

I have a rating system which uses css and jquey. I have 5 stars, the stars are radio buttons and I used CSS to change them into stars,

I have been asked to modify if so that if someone clicks the 5 star, then the other 4 also change to selected star, or if you click the 3 star, then 2 and 1 also change.

I just want to css display to change, I don't want to change the stars to a selected value for when the form is submitted

I made an initial jquery attempt wth no luck, I am not even sure I am applying the right class
https://fasdinfotsaf.ca/en/fee-for-service/

FYI, the rating is based on 1 per IP, so if you submit it, you wont see stars anymore


My jquery attempt
jQuery('#star5').change(function() {

                  if( ($(this).is(':checked')))  {
						  $("#star4, #star3, #star2, #star1 ").addClass(".star:checked:before");
					}   else   {
						 $("#star4, #star3, #star2, #star1 ").addClass(".star");
					}
	
		 });

Open in new window


My HTML
<input type="radio" name="ratings" value="1" class="star" id="star1"> 
<input type="radio" name="ratings" value="2" class="star" id="star2">
 <input type="radio" name="ratings" value="3" class="star" id="star3">
<input type="radio" name="ratings" value="4" class="star" id="star4">
<input type="radio" name="ratings" value="5" class="star" id="star5">

Open in new window


My CSS
.star {
    visibility:hidden;
    font-size:30px;
    cursor:pointer;
	display:block;
   float:left;
   margin-right:15px;
}
.star:before {
   content: "\2606";
   position: absolute;
   visibility:visible;
   color:#1ac0da;
   
   
}
.star:checked:before {
   content: "\2605";
   position: absolute;
   color:#1ac0da;
}	

Open in new window

1
Dear Experts,
I'm new to Ajax and JQuery,
is it possible to post variables to another domain with below code?

How can I see the result of the below post code on my page? it posts on my site, through on my own domain.

    <script>
	
var xhr = new XMLHttpRequest();
xhr.open("POST", 'the URL', true);

//Send the proper header information along with the request
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

xhr.onreadystatechange = function() { // Call a function when the state changes.
    if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
        // Request finished. Do processing here.
    }
}
xhr.send("foo=bar&lorem=ipsum");
// xhr.send(new Int8Array()); 
// xhr.send(document);


	</script>

Open in new window

0
Dear Experts,
I'm new to JQuery, I'd like to post some data to a page but I need to add header information.
How can I add this header to below code?

headers: ['Content-Type: application/json','Authorization: Autho xxxxxxx'],

thank you

	<script type="text/javascript">
        $(document).ready(function () {
			
		 $('#ajaxBtn').click(function(){
			 
   		
			$.post('theURLtoPOST',   // url
			    {"ProductId":"1","Id":"54"},

			   function(data, status, jqXHR) {// success callback
						$('p').append('status: ' + status + ', data: ' + data);
				});
			});
    });
    </script>

Open in new window

0
Dear experts,

i have an input type file to upload something,

 <input id="formAttach" name="formAttach" class="input-file" type="file">

Open in new window


Is it possible on selecting the file, duplicate it automatically in an other input type hidden with the full path/name of the file and his extension for value in the same form ?
0
Hello,

Here's the background - I have a site that has a few functional areas where the source code is compiled and I don't have access to it. Occasionally, those pages generate some nasty errors, which I would like to clean up. A further catch is that the errors are specific to this program and not IIS/.NET, so there aren't error codes that I can lock in on.

I have been successful at identifying and replacing text using JQuery when the errors pop up - they are less ugly as a result! However, I'd like to use the same methodology to just redirect the page entirely on load.

So, in a nutshell, the process would be:
1. Page starts to load
2. JQuery (or something else  - I'm open) detects the error text
3. Page redirects to a new URL that has more information and is friendly

I know it's not great, but it's better than what I'm working with now. Here's what I'm doing with JQuery now:

jQuery(".ErrorHeader").text($(".ErrorHeader").text().replace("ERROR ERROR ERROR ERROR ERROR BAD INFORMATION", "Sorry, this page can not be loaded. Please hit the back button on your browser or try again."));

Thanks!
0
Hi,

I am working on this page:
https://genealogiskforum.dk/Gf_Magasin_content/
It has four panes at the top of the page, and this question is only about pane three and four.

If you go into pane three you see this navigation section at the top of the page.
Sk-rmbillede-2019-03-12-07.42.42.pngIt is in danish, but the translation is like this: Forrige = Previous, Næste = Next, Side = Page (the box shows the actual page number), af xx sider = of xx pages.

When using the Next and Previous buttons the pagenumber in the box changes nicely in both pane three and pane four. The problem is that when entering a pagenumber in the box in pane three and hit Enter nothing happens, and when doing the same in pane four it goes to the page you have entered as expected.

I get no messages in the console, ant no other other errors - just nothing happens.

The code lines in question is for pane three these:
HTML:
<div class="flex-item"><input type="text" style="width: 45px; text-align:center; color: #f6f6f6; background-color:#808080; border: 1px solid #f6f6f6;margin-left:18px" id="my-page-input" value="1"></div>

Open in new window


Script:
var input5 = document.getElementById('my-page-input');

    input5.addEventListener('keypress', function(event) {
        if (event.which === 13) { // Return key
            viewer.goToPage(parseInt(input5.value, 10)-1);
        }
    });

    viewer.addHandler("page", function (data) {
        input5.value = ( data.page + 1 );
    });

Open in new window


And the codelines for pane four are these:
HTML:
<div class="flex-item"><input type="text" style="width: 45px; text-align:center; color: #f6f6f6; background-color:#808080; border: 1px solid #f6f6f6;margin-left:18px"; id="my-page-input2" value="1"></div>

Open in new window


Script:
var input2 = document.getElementById('my-page-input2');

    input2.addEventListener('keypress', function(event) {
        if (event.which === 13) { // Return key
            viewer.goToPage(parseInt(input2.value, 10)-1);
        }
    });

    viewer.addHandler("page", function (data) {
        input2.value = ( data.page + 1 );
    });

Open in new window


I just can't figure out where I am going wrong here, and I hope that someone can help me out with this.
0

jQuery

17K

Solutions

5K

Contributors

jQuery (Core) is a cross-browser JavaScript library that provides abstractions for common client-side tasks such as Document Object Model (DOM) traversal, DOM manipulation, event handling, animation and Ajax. jQuery also provides a platform to create plugins that extend jQuery's capabilities beyond those already provided by the library.

Related Topics