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

Here is the ajax call

function showCustomProps(){
    
    $('#subaction').val("getCustomProperties");
    var data = $('#subaction') ;
  
  
    $.ajax({
        type: "POST",
        url: 'controllers/contacts.ajax.php',
        data: data,
    }).success(function (response) {
      
        
        
        console.log(response);
        
    }).error(function (data) {
        console.log("erro customProps");
    });
    
} //showCustomProps

Open in new window


this is triggered on load.

to run this code -

$stmt = new Database();

				$query = "SELECT cp.id, cp.name, cp.field_type 
							FROM custom_properties cp
							WHERE cp.client_id = :clientID AND cp.viewable='1' AND cp.type = '1'
							ORDER BY cp.id DESC";
				$stmt->query( $query );
				$stmt->bind( ':clientID', $clientId);
		     	$stmt->execute();
				$demo1 = $stmt->fetchAll();

				foreach($demo1 as $customResult){
					$cusData['propertyId'] = $customResult['id'];
					$cusData['propertyName'] = $customResult['name'];
					$cusData['propertyType'] = $customResult['field_type'];
				

			

				}//customresult

						$response = array(
							'subresult' => 'customProps success',
							'data' => $cusData
						
							
						);

		break;

Open in new window



Now the issue is that it is returning null.  but if i change fetchAll to all it returns a row from the database, i need this foreach to fetch all records not just the first one. if i return demo1 instead of customResult i can see there is two records, Please note i can only see this data if i use all() and when i use fetchAll it returns null.
0
Upgrade your Question Security!
LVL 12
Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Quite a puzzling issue,  so i am trying to get the inputs of checkboxes, which works fine but when i want to get a 2nd check from a different div it cannot be found but can later down the line.

code -

var propCheck = $('input', '#default-checked-list , #checked-list-container ').each(function(){}); // cannot find checked-list-container here
     var chkStateCollection = [];
       
       

    
      
    propCheck.on('change', actProp);

    function actProp() {
      
     var isChecked = $(this).is(":checked");
     var propChk = "#" + $(this).attr('name');
     var chkCon = "#" + $(this).attr('class'); 
     var chkState = $(this).attr('id'); 
     var getConID = "#" + $(this).val();
     
     
 
     if(isChecked) {  
        chkStateCollection.push(chkState); 
        var index = chkStateCollection.indexOf(chkState);
        console.log(chkStateCollection);
        console.log(index);
        var disProp = $('input', '#default-checked-list , #checked-list-container ').each(function(){}); // but can find checked-list-container here
         console.log(propCheck);
        console.log(disProp);
         
        
         
       $(propChk).fadeIn(1000);
       $(chkCon).fadeIn(1000);
       $(getConID).fadeOut(1000);
         
         console.log(getConID);
        
         

        $('#subaction').val("setChkState");
        
        
        
     //  var data = $('#subaction').serialize();

           $.ajax({
                type: "POST",
          

Open in new window

0
How to fetch HTML Input Id in code behind ASP.Net MVC ? Either on Controller or on Model ?

 view / .cshtml 

<button type="submit" id="previewButton" >Preview</button>

JQuery : - This will not be in use.

$("button").click(function ()
    {
        var btn = this.id;
          alert(btn);
   }

In Controller :

[HttpPost]
        public ActionResult New(MyViewModel viewModel, string clickedButton)
        {
            
            var vm = clickedButton;
            return View(vm);
        }

- MyViewModel
 public string clickedButton { get; set; }

Open in new window

0
I have setup a Sphinx search which uses jQuery AutoComplete functionality to display search suggestions. Auto Suggestions are coming from a database table.
What is the best way to generate AutoComplete Suggestions. Currently I am adding keywords manually in a table.

I want to display common words from news titles and descriptions. As news are added on daily basis what is the best way to
generate search suggestions in some best way.

PS: I have heard about META Fones. Is it related to AutoComplete Search?
0
Hello guys good evening... I have dataTable with Drop Down sorting using their unique ID's
 i want to filter dataS to table by Branch... How can I achieved it using server side pdo jquery here is my code

Drop Down
<label>Branch</label>
<select id="branch" class="form-control">
<option value="">Select Branch</option>
<option value="1'">First Branch</option>
<option value="2'">Second Branch</option>
<option value="3'">Third Branch</option>
</select>
<!----Table Item Data------>
<br/>
		<div class="container box" style="width:100%;">
			<div class="table-responsive">		
				<table id="itemdata" class="table table-bordered table-striped" width="100%">
					<thead>
						<tr>
						<th width="10%">Branch</td>
						<th width="10%">Outlet</td>
						<th width="15%">User</td>
						<th width="15%">Item</td>
						<th width="10%">Brand</td>
						<th width="10%">Serial No.</td>
						<th width="10%">Purchase Date</td>
						<th width="20%">Remarks</td>
						</tr>
					</thead>
					<tfoot>
						<tr>
						<th>Branch</td>
						<th>Outlet</td>
						<th>User</td>
						<th>Item</td>
						<th>Brand</td>
						<th>Serial No.</td>
						<th>Purchase Date</td>
						<th>Remarks</td>
						</tr>
					</tfoot>
				</table>
			</div>
		</div>

<script>
$(document).ready(function () {
	var dataTable = $('#itemdata').DataTable({
		"dom": '<"#buttons">lrti<"clear">',
		"bFilter": true,
		"bInfo": false,
		"scrollY":        "50%",
		"footer": true,
		"header": true,
        

Open in new window

0
I have a textbox field. User can type a desire keyword and then click on Search button or Press ENTER key.This will call a JS function which actually runs an AJAX code to perform a search

Also the keywords are appended with browser url like :
http://www.mydomain.com/search?keywords=2018
(I have a short js code for this which append keywords with url)


The Issue:

If user directly open this url
http://www.mydomain.com/search?keywords=2018
Then search function is not called.

Also if user change the search keywords like
http://www.mydomain.com/search?keywords=hello
Then search function must be called with these parameters

I want that user can also enter  search keywords via the URL also

Here is my code

jQuery("#SearchKeyword").keypress(function(e) {
    if(e.which == 13) {
        inputNewsSearch();    
    }
});

Open in new window


And this is the function code

function inputNewsSearch(){

    var SearchKeyword = jQuery("#SearchKeyword").val();	
	
            jQuery.ajax({
        type: "POST",
		url: base_path+'sites/all/themes/nexus/templates/news-search.php?',	
        data: {SearchKeyword:SearchKeyword,path_base:path_base,lang_name:lang_name},
        async: true,

        error: function(jqXHR, textStatus, errorThrown) {
            alert(jqXHR.status);
            alert(textStatus);
            alert(errorThrown);
        },
        success: function(result) {
			
		if (history.pushState)
		{
          var newurl = 

Open in new window

0
do you know any api that allow me to called all major social media sites such as facebook, twitter, and etc. in one shot?
I just do not want to call them individually. and hope there it has a api bundle to do all in one...
0
I have below html select(id - event). and I try to capture the value after $ sign and then convert into float  and then drop into textbox called 'price' in javascript.
if after $ is null, then return "0"

how can i do that?

<select id="event">
                                      <option value="Event - Arizona Bike Week - $1000">Event - Arizona Bike Week - $1000</option>
                                      <option value="Event - BottleRock Music Festival - $1600">Event - BottleRock Music Festival - $1600</option>
</select>
<input type="text" id="price">
                                   

Open in new window

0
I am trying to do something with ScrollMagic and I'm stuck.

This example on scrollmagic.io shows almost what I want to do:
http://scrollmagic.io/examples/advanced/section_wipes_manual.html

The only thing I would like to add, is the ability to "pause" the scrolling on a given slide (i.e., make it "sticky"). So that as you continue scrolling, the slide stays on your screen for a given number of pixels, then continues on to the next slide.

A good example of what I want is in this example on scrollmagic.io:
http://scrollmagic.io/examples/basic/section_wipes_natural.html

Note that in-between screens 3 and 4 there is a pause. This is achieved by adding margin-bottom to screen 3.

However, using the first example, it doesn't appear that adding margin-bottom achieves the pause, because the animations are built in a different way.

I was hoping someone more familiar with ScrollMagic may have some good advice on how to tweak that example, which will then correspond to exactly what I'm trying to do.

Thank you!
0
Hi,

I want to invalidate my form using jQuery/Javascript.

User enters date field (having id# vhdnPickUpDate) and time field (having id# vPickUpTime)

User should not be able to submit the form if date time is less than 4 hrs which user has entered.

Current time is in field hdnDateTime from where date time needs to compare.

I need to know the logic for this.
How to invalidate the form if datetime is less than or equal to 4 hrs.
Also, accordingly date field needs to be highlighted.

Kindly advise me the solution.

Below is the logic required and details.

var form = $("form");

hdnDateTime= "04/08/2018 07:30:00"

vPickUpDate="04-08-2018"

vPickUpTime="5:30 AM"

var dtTime = vhdnPickUpDate +" "+ vPickUpTime=;
var dtTimeMinus4Hrs = dtTime - 4 hrs;

if(hdnDateTime <= dtTimeMinus4Hrs)
{

invalidate form
Highlight field with id = Item_PickUpDate
// Kindly advise me the solution
}

form.validate();
if (form.valid()) {

}else {
   $('form').validate().focusInvalid();
 }

Open in new window


Regards,
0
Cloud Class® Course: Microsoft Exchange Server
LVL 12
Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

I have some data attributes set to equal nothing when the page loads. Once a user selects an item from a list item it then populates the data attributes. I want to perform a simple validation that says if one of those attributes is empty then alert an error otherwise carry on.

If I press the button with nothing in the field, I get the error which is fine. But if I then select something I can see in console that the button now has values in the data attributes but I still get the validation error. The same is true if I do the opposite. If I select an item then it passes validation. If I clear the field it should fail validation but it still fails. It seems that the second time around it is still using data from the first click.

$('body').on('click', '#checkoutAsCustomer', function(e) {
	e.preventDefault();

	var user_email = $(this).data('newemail');
	var uid = $(this).data('newid');
	var first_name = $(this).data('namename');

	if(uid !== '') {


		//make ajax call


	} else {

		alert('No values');
	}

});

Open in new window

0
Hello. When I search the user name in the search box of autocomplete by using the first letter of the user name. Its not showing any names. When I enter the second letter its showing the names. But when I erase the second letter of the name and its showing the names with the single letter.

Here are the code I’m using:

keyUp: function (e) {
                var inputFieldName = this.name;
                var inputFieldValue = this.value;
                console.log(inputFieldName);
                console.log(inputFieldValue);
                var autocompletedata='';
                if(inputFieldValue != undefined){
                if(inputFieldName==='checkedoutuser' && inputFieldValue.length >= 1) {
                    var inputFieldValue = this.value;
                    Vsuite.services({
                           service:'searchsuggestion',
                          async: false,
                           type: 'get',
                           json: true,
                           data: {
                                  facetValue: inputFieldValue, 
                                  resultSetLimit: 20
                         }
                          }).done(function (responseData) {
                              console.log(responseData);

                              var checkedOutId = $('.repeat-instance input[name="'+inputFieldName+'"]').attr('id');
                              this.setProperties({
                                  

Open in new window

0
I have what appears to be a download issue with IE and multiple applications developed as an .HTA where the library files for bootstrap and jquery will not download.  This does not happen every time.  There will be a delay as long as 20 minutes and then I will get the download dialog in IE  "The file couldn't be downloaded." or a script error in the HTA files showing the cdn link.  This just started a few days ago and the HTA files have been working for months with no problems.  Is there a way to trace where the delay is at or what might be causing it?  I have cleared cache several times.  When the HTA does come up if I use control + F5 then everything works as normal.  This in on windows 7 machine.  I have tried clearing all the content in the HTA file with the exception of the script src and css cdn references and it still occurs.  I have also tried different cdn sites and no change.  I don't know if I can force the HTA to use the cached version of the files instead of downloading each time or if that is even the issue.
0
Hello

I am working on a site that has some background images.  The background images are created by css.    I would like someone to review the css and confirm that it is indeed a true background image.

I am asking because I want to use some javascript effects on the image -- but they only work with "background images".

Here's the link to the page  Link to page

Here's the image link:  Image file via url

And here's the css I find via firebug related to the above image.  
div#shopify-section-1489283919239.featured-collection-section .parallax_image {
    background: url(//cdn.shopify.com/s/files/1/0008/6940/0623/files/goldenbannernew.png?v=1529908976) no-repeat scroll;
        background-attachment: scroll;
        background-size: auto auto;
    background-size: cover;
}

Open in new window

BTW in order to attach some javascript effects to the backgorund image I realize I will have to remove some of the existing css, such as
 background-attachment: scroll;
        background-size: auto auto;

Open in new window



So with all this "evidence" I am 99 percent sure that it is indeed a traditional background image (even though it's created via css and  not embedded directly in the HTML).

Just an Expert confirm that it is indeed a background image -- and that there are no warnings that I have not thought of == as I try to add some special effects to that image.

Such a long winded question for such a simple request!  :)

Best
Rowby
0
Hi,

I have a problem with my website: link to my site.

If I check the site from a mobile device, there are huge space after the descriptions in normal mode in mobile Chrome.  If I load it in Incognito mode, the space disappears.
I checked with Firefox Inspector in Responsive Mode: 'w-testimonials type_masonry' is 8097px, but it should be somewhere ~3836px. (at the 1st description)

Where is the problem and how can I resolve it?

Thanks advanced,
Steve
Capture.JPG
0
Does Angular.js or Ember.js the better choice for JavaScript frameworks?
0
Hi,

I have a good working function:

$("#TogglePat").click(function(){
  $("#PatIcon").toggleClass("fa-toggle-off fa-toggle-on",1000);
  $(".PatField").toggle("slow");
  $("#ssBezorgadres option[value='Patiënt']").prop('disabled',function(i,v){return!v;});
};

I have a textarea element with a placeholder in place, on click of the above function I want the content of the placeholder to change (need to remove a bit if tekst) and be placed back when I click it again.
Hoe do I do this?
0
Hello Experts,

I am trying to use browser back button to go to a specific URL. I used PlatformLocation in Angular to detect the popstate event. When I press the back button to go to the URL, it shows the previous angular route for fraction of seconds and then redirects me to the URL. I would like to eliminate that fickle from back button. So, it directly goes to the desired URL, without going to the previous angular route.

Thanks in advance.
0
https://developers.google.com/places/web-service/search

I want to use above API to get place = 'rv_park' and my question is if I want to get place type = 'rv_park' in california only.
how can i do that? Basically, I just do not know how to filter by state. I use mvc/c#/razor.

Thank you for your helps in advance.
0
Cloud Class® Course: MCSA MCSE Windows Server 2012
LVL 12
Cloud Class® Course: MCSA MCSE Windows Server 2012

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

1. in javascript, how to get 15 from this url ? http://localhost:29792/Home/test/15
and
2. in javascript, how to get rid of "#' sign when I have http://localhost:29792/Home/test/15# ?

Thanks
0
I want to position an AJAX post in the context of a loop. The challenge is grabbing a value that's coming from the previous POST.

How could I pull that off?

Here's what I've got so far:

First off, on the main page, the user clicks on a button and that "gets" the hello.php page:

$(document).ready(function() {
	
	$('.print_forms').click(function() {
		var empID = $(this).data('empid');
		var hID=$(this).data('hid');
		var itemSel=$(this).data('item_sel');
		var cpID=$(this).data('cpid');
		var orderID=$(this).data('orderid');
		var quantity=$(this).data('quantity');
		var primeID=$(this).data('prime_id');
		var laps=$(this).data('laps');
		//alert(empID);
		$.get('hello.php?empID='+empID+'&hID='+hID+'&item_sel='+itemSel+'&cpID='+cpID+'&orderID='+orderID+'&quantity='+quantity+'&primeID='+primeID+'&laps='+laps,
		function(data) {
			$('.centered').show();	
			$('.centered').html(data);
		});
	});
		
});

Open in new window


The "hello.php" page has some minimal HTML that displays a loading graphic. At the bottom of that page is where I'm running into the challenge...

var laps=<?php echo $laps-1;?>;
		for(i=1;  i<=laps; i++)
		{
			setTimeout(function() {
				var out = {
				'empID': <?php echo $empID;?>,
				'hID' : <?php echo $hID;?>,
				'cpID' : <?php echo $cpID;?>,
				'orderID': <?php echo $orderID;?>, 
				'quantity':<?php echo $quantity;?>,
				'PrimeID': <?php echo $bob;?>, 
				'laps':<?php echo $laps-2;?>
				};
				$.post("hello_again.php?PrimeID=", out, function(data) {
					console.log(PrimeID);
					$('#gear_text').html(data);
				});
			},2000);

Open in new window


Can you smell what I'm cooking?

The idea is that I've got a known number of "laps" that I have to complete. Each lap goes out and "GETS" the next round of records based on the previous PrimeID.

THAT's my struggle!

How do I get the most recent PrimeID - the value that's arriving in the context of the "data" returning from my POST?

Any ideas?
0
I have a table with rows that I hide and show using the jQuery functions show() and hide(). I have some css rules that display the table with alternating row colors by doing something similar to the following:

tr:nth-child(odd) {
    color: #000000 ;
    background-color: #F8F8F8 !important;
}

Open in new window


and something similar for the even rows.

My problem is that the style is applied to all rows even the hidden ones so as a result my table does not have alternating row colors when some of the rows are hidden. I have tried doing the following but that did not work:
]tr:visible:nth-child(odd) {
    color: #000000 ;
    background-color: #F8F8F8 !important;

Open in new window


I am hoping someone can help me with this
0
Here i some javascript use to input field hide and show. It work in firefox well, but not working on chrome. Below my code to your refferrance.

Visit this link: http://jsfiddle.net/vwt10rce/6/ in chrome and firefox.

$("#other-school").hide();
  
$("#other").click(function(){
   $("#other-school").show();
});
	
$("#school").click(function(){
   $("#other-school").hide();
});  

Open in new window

0
I'm new to mysql and need some help. I have populated a multi-select drop down with my first query. The dropdown populated correctly and I want to use the value or values from the dropdown to get results from a second query. I will try to explain some more.

I have a multi select dropdown named students that is populated with Names and values that are numbers. I want to select one, two or all and use those values in a second query. The dropdown will have values like 390, 234, 5421, 461. If you look at the query below you will see the student_id = 461 that value is what I want to get from the dropdown. This query works if I place in the student_id.

SELECT *, student_id, SUM(handled) FROM stats WHERE student_id = 461

From there I
echo "Handled: " . $row["SUM(handled)"]. "";
and that works just fine.

Thanks for any help.
0
We have a site that has some js that opens/closes panels in a bootstrap theme.   We want to be able to add to the script to post if the panel is opened or closed so that if the user comes back, it will be open or closed like it was when they were there last.

This is the code that is called in an external .js file.

jQuery(document).on('click', '.panel .tools .fa-chevron-down', function () {
        var el = jQuery(this).parents(".panel").children(".panel-body");
        if (jQuery(this).hasClass("fa-chevron-down")) {
            jQuery(this).removeClass("fa-chevron-down").addClass("fa-chevron-up");
            el.slideUp(200);
        } else {
            jQuery(this).removeClass("fa-chevron-up").addClass("fa-chevron-down");
            el.slideDown(200);
        }
    });

Open in new window


This is the html that is calling it

<div class="col-lg-6 column draggable" id="panel_id_1" data-column="#panel_id_1_col#" data-row="#panel_id_1_row#">

                      <section class="panel">
                          <header class="panel-heading panel-homes">
                              MY NOTIFICATIONS SINCE LAST LOGON					

                              <span class="tools pull-right">
                                <a href="javascript:;" class="fa fa-chevron-down chevwhite"></a>
                            </span>
                          </header>
</section>
</div>

Open in new window


I know I need to add an update to it (I think!) and pass the id variable - id: $(this).attr("id") and some sort of post but I have no idea where to put it, etc to call my script (that I have already written.    Can i get some guidance on where to add this new information to the current script?
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