Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x

jQuery

16K

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

What is the angular 2 version of this jquery code ?

$(this).parents().find('ul#breadcrumb').append('<li>Create </li>'); 

Open in new window

0
[Webinar] Lessons on Recovering from Petya
LVL 10
[Webinar] Lessons on Recovering from Petya

Skyport is working hard to help customers recover from recent attacks, like the Petya worm. This work has brought to light some important lessons. New malware attacks like this can take down your entire environment. Learn from others mistakes on how to prevent Petya like worms.

http://utahkidsfoundation.com/howyoucanhelp

See the grey border around the document (circled in red)?  How can I get rid of it?

I think the border might be part of the styling for the linked google document I have embedded in the webpage.  So I need to wait to attempt the removal until AFTER the embedded page has completed loading.

Could use some help.  I am thinking about a jQuery solution and prefer that.

grey border kill
0
Can I have one MODAL with several buttons and just change the MODAL-BODY ? Right now I have :

     <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">Q & A</button>         

    <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-body">
                            <p>This is a test</p>
      </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>

But I would like to have that same modal, and then be able to send the modal-body according to the button that was pressed. I want to do this to avoid writing a modal per button (coding would be too long and I just want to modify the modal content.
Ex, Button 1 - modal this is button 1 content
Button 2 - modal this is button 2 content
Button 3 - modal this is button 3 content
etc...
0
in my aspx, page I have a div, which I use to write html data being generated dynamically on the server side.

How can i open this html data in the div, in a new window/tab on a buttonclick.
0
Sharepoint version is : 2013 Enterprise server with SP1  15.0.4571.1502
Jquery versions tried : 1.5.2, 1.7.2, 1.10.2
 
jQuery deployed globally using THIS Method of deploying a delegate control.

Without the feature activated, sharepoint works perfectly as expected in every aspect.  Activate the feature, so that jQuery is loded on the page, and sharepoint does all kind of weird things like...
Go to feature management and you can no longer deactivate any feature.

f12 into browser debug mode and the reult of just activating the jQuery feature and then refreshing the page casues all of the following...

chrome console log of errors
Google has been of little help and I have given up banging my head for one day.  Anybody have any clues?

P.S.
This is also the exact same result if I just create a new master page and add a link to the jQuery via the  <!--SPM:<SharePoint:CustomJSUrl runat="server"/>-->  method.
0
I have a bizarre problem.  I have a MVC 5 razor view with both a datepicker and a clockpicker.  The text box with the clock picker works just fine when calling the jquery change event, but the text box with the datepicker won't!  

Here is my form:
<div class="form-group">
            @Html.LabelFor(model => model.PatrolDate, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <div class="input-group date " id="datePicker1">
                    @Html.EditorFor(model => model.PatrolDate, new { htmlAttributes = new { @class = "form-control" } })
                    <span class="input-group-addon">
                        <span class="fa fa-calendar"></span>
                    </span>
                </div>
            </div>
        </div>

<div class="form-group">
            @Html.LabelFor(model => model.TimeEnd, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <div class="input-group clockpicker">
                    @Html.EditorFor(model => model.TimeEnd, new { htmlAttributes = new { @class = "form-control" } })
                    <span class="input-group-addon">
                        <span class="fa fa-clock-o"></span>
                    </span>
                </div>
            </div>
        </div>

Open in new window


and here is the javascript:
$("#PatrolDate").change(function () {
        alert("date changed");
});

$("#TimeEnd").change(function () {
        alert("time changed");
});

Open in new window


I am totally perplexed!  I am using jquery 3.1.1
0
Dear All,

I am looking into building a SharePoint form on Sharepoint 2013 which I will be able to split across different pages (e.g. like one would have done with jQuery if he was building it as a web page) and form validation on submission (again, along the same lines that jQuery plugins offer this functionality in the case of web applications).

Could someone please provide any pointers to resources that could be of use (old programmer, but new to SharePoint)?

Regards,
George
0
I want to do following:

1. Load Original.xml
2. convert to string look like result.xml
3. for loop and list
      Response.write attribute("id") + "  " + attribute("value")
   next

how can I do that in c#?


Original.xml
<?xml version="1.0" encoding="utf-8" ?>
<Surety QuoteID="123" CreatedDateTime="01/10/2017">
  <Line>
    <Commercial>
      <Bond Name="Notary" Form="Notary.pdf">
        <State name="CA">
          <Step name="Principal" StepNo="Step 1">
            <input type="text" class="" id="principalPhoneNo" placeholder="Custom field" value="310" />
             <input type="text" class="" id="principalPhoneNo2" placeholder="Custom field" value="210" />
            <input type="text" class="" id="principalPhoneNo3" placeholder="Custom field" value="110" />
          </Step>
          <Step name="P2" StepNo="Step 1">
            <input type="text" class="" id="principalPhoneNo4" placeholder="Custom field" value="310" />
             <input type="text" class="" id="principalPhoneNo5" placeholder="Custom field" value="210" />
            <input type="text" class="" id="principalPhoneNo6" placeholder="Custom field" value="110" />
          </Step>
        </State>
      </Bond>
    </Commercial>
  </Line>
</Surety>

Open in new window


Result.xml
<?xml version="1.0" encoding="utf-8" ?>
<Surety QuoteID="123" CreatedDateTime="01/10/2017">  
            <input type="text" class="" id="principalPhoneNo" placeholder="Custom field" value="310" />
            <input type="text" class="" id="principalPhoneNo2" placeholder="Custom field" value="210" />
            <input type="text" class="" id="principalPhoneNo3" placeholder="Custom field" value="110" />       
             <input type="text" class="" id="principalPhoneNo4" placeholder="Custom field" value="310" />
             <input type="text" class="" id="principalPhoneNo5" placeholder="Custom field" value="210" />
            <input type="text" class="" id="principalPhoneNo6" placeholder="Custom field" value="110" />  
</Surety>

Open in new window

0
I have a blockui popup layer where there is a form. I want to clear the text "Enter your email address" when the user clicks the input field. But when the popup layer opens, the text is gone. How to fix that issue?  Thanks a lot!  My code is as follows:

<input name="emailAddress"  type="text" value="Enter your email address" onfocus="if (this.value == 'Enter your email address') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Enter your email address';}" />

The above code works perfectly fine if it's on a web page, but it doesn't work if it's a blockui layer.

Really appreciate your help.
0
Hi
In code bellow clicking the button should move the random row to the top of the table
However it only works  if the random number is <= 10 or the paging is set to false any ideas how to fix it  

https://jsfiddle.net/493gpg5a/
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ajax Table</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script> 
    	<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.15/fc-3.2.2/fh-3.1.2/rr-1.2.0/sc-1.4.2/datatables.min.css"/>
 
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.15/fc-3.2.2/fh-3.1.2/rr-1.2.0/sc-1.4.2/datatables.min.js"></script>
	

<script type='text/javascript'>
	$(function() {
      // jQuery
      $('#example').DataTable({
            scrollY : '200px', 
            scrollCollapse: true,
            paging: true,  // set to false works
            searching: false,
            info: false
      });
       $('button').on('click', function (){
       $('tr').removeClass("highlight");        
        var ID = randomIntFromInterval(1,20);
         alert("Highlight row " + ID);
//         $("#row_" + ID).toggleClass("highlight");
      $("#row_" + ID).prependTo('#example').toggleClass('highlight');

     });
});

function 

Open in new window

0
The top UI technologies you need to be aware of
The top UI technologies you need to be aware of

An important part of the job as a front-end developer is to stay up to date and in contact with new tools, trends and workflows. That’s why you cannot miss this upcoming webinar to explore the latest trends in UI technologies!

<script>
$(document).ready(function(){            
var i= $(".sidebar-menu li").index();

var open = ["document_driver.html","upload_document.html","edit_document.html","","","","","","","",""];
$(".sidebar-menu li").click(function(){
            $(".treeview li").removeClass("active");
            $(".treeview li:nth-child("+i+")").addClass("active");
            
              $(".content").load(open[i);
                        
                  });
$(".sidebar-menu li").hover(function(){
var i= $(this).index();
//console.log(i);
});
                  
                  });//ready
                  
                  
        </script>

in this eg execute a load method once, so how can access the  current(this) related html pages
0
how to export jsp content, (which will have html div and pie charts) to pdf/excel/csv..
any solution?
0
I want to develop charts in my project using jsp.
please suggest any open source which should have options to export to different formates.
0
<asp:DataGrid ID=dg1 AllowPaging=True PageSize=22 PagerStyle-Mode=NumericPages PagerStyle-Position=TopAndBottom AutoGenerateColumns=True Width="95%" HorizontalAlign="Center" CellPadding=0 CellSpacing=0 BorderWidth=0 Runat=server>
								<HeaderStyle CssClass=BasicListHeader ForeColor="white" />
								<ItemStyle CssClass=BasicListItem />
								<AlternatingItemStyle BackColor="#e4e4e4" />
								<Columns>
									<asp:EditCommandColumn EditText="Edit" UpdateText="Update" CancelText="Cancel" ItemStyle-Width="1%" />
									<asp:ButtonColumn ButtonType=LinkButton CommandName="Delete" Text="Del" ItemStyle-Width="1%" />
								</Columns>
							</asp:DataGrid>

Open in new window


The code behind creates the columns for the rows for multiple tables.  My issue is that I will have different number of columns per table and I do not know how to create a modal to reflect different number of columns.
TableEditor-Screen.docx
0
I had this question after viewing jQuery Accordion with long content force scroll to top when clicked.
I would try to implement above code answer, but clueless where and how to do it given code I am using currently.

Hello (new here), I am not a JS coder, so a little clueless. I would like content of my simple accordion, once an item is clicked, to have content scroll to top of browser screen. Showing the beginning of content always at top of screen.

Also, some of my content is a bit long, so I would like all content, once clicked, content to appear/scroll to top screen, irregardless of size or length of previous content that might still be open Vs New content when clicked, scrolling up and past top of browser screen following the closure of a longer bit of previous content closing. Hope that made sense.

I have found many great codes to implement this already online, but I cannot figure out what to place & where, as each person's code slightly differs from another in wording. Thanks in advance and apologies for any improper JS terminology used. Attaching webpage for reference.
https://eyescreamjewelry.com/pages/faq-1
Please note I also have sort of Header separating what looks like multiple accordions (if that matters).

Thanks again for your time.

Also attaching code for reference:

(function($) {
    

Open in new window

0
Hello Experts,

Using PHP, what is the best way to verify the user’s information, modify the information if necessary, and then process their information?

NOTE: For this particular question, I am not concerned about checking if the form is completely filled out. That is the easy part. If I’m thinking correctly, that is only a matter of checking if each $_POST variable is set.
0
I want 5 simple web form project shared with one masterpage.
And I have google and can't find one that is fully working

If you know how please show me in codes.

Thanks
0
I am trying to create a dependent dropdown list. Right now in the masterDataQueryScreen.jsp, I am directly calling a method in in my MasterDataDao class called getAllSites. What I would like to do is create a dependent drop down list. So basically, if the division in the jsp has a value of either 33, 36, or 40 call the method getAllJJSites  in the MasterDataDao class to populate the second dropdown else call getAllSites. The getAllJJSites is on line number 642 in the MasterDataDao class. I have also included jquery-1.11.1.js under the js folder under WebContent. I am assuming I will need to use jquery. Please let me know what else is needed. Thank you so much in advance. I have been stuck on this issue for at least a month now and cannot find a great example using a query.
0
i have to represent no of device for each status(new,paired,blocked..etc) in the charts.
i want use  jquery and bootstrap with out using CanvasJS
please provide example of donut charts
0
A new era in Cloud training has arrived.
A new era in Cloud training has arrived.

A day that will go down in Cloud history.. But are you ready for it? Will you accept this Cloud challenge?

Hello Expert,

I have one javascript function which is convert UTC time to local time. i have passed utc date in this function which i have put it in master page.

 function utctimelocal(OriginalDate)
                                        {
                                            var usertime = Date();
                                            var p = OriginalDate.split("-");
                                            var localdate = new Date(p[2], p[1] - 1, p[0], p[3], p[4], p[5]);
                                            var d = new Date();
                                            var n = d.getTimezoneOffset();
                                            if (n < 0) {
                                                usertime = new Date(localdate.setMinutes(localdate.getMinutes() + (-1 * n)));
                                            }
                                            else {
                                                usertime = new Date(localdate.setMinutes(localdate.getMinutes() - n));
                                            }

                                            var month = new Array();
                                            month[0] = "Jan";
                                            month[1] = "Feb";
                                            month[2] = "Mar";
                                            month[3] = "Apr";
                                            month[4] = "May";
                             

Open in new window

0
I would like to see how to create a dependent dropdown list within my existing JSP page.
Basically, if I choose one value in the first dropdown list I would like to populate the second dropdown list with results from one query
else
I would like to populate the second dropdown list with results from another query.
I've heard jquery can do this but I have not found any examples related to query list results.
0
var clone = function (donor) {   
  if (Object.create !== undefined) {   
    clone = function (donor) {   
      return Object.create(donor);   
    };   
  } else {   
    clone = function (donor) {   
      var Proxy = function () {};   
      Proxy.prototype = donor;   
      return new Proxy();   
    };   
  }   
  return clone(donor);   
};   
var banana = {   
  heavyCream: [1, "cup", "Organic Valley"],   
  halfHalf: [1, "cup", "Organic Valley"],   
  sugar: [9/16, "cup"],   
  yolks: [3],   
  banana: [1 + 1/2, "cup, puréed"],   
  coconutMilk: [1/4, "cup"],   
  lemon: [2, "tsp", "freshly juiced Meyer lemon"],   
  vanilla: [1, "bean", "Madagascar Bourbon"]   
};   
var chunkyMonkey = clone(banana);   
chunkyMonkey.walnuts = [3/4, "cup, coarsely chopped"];   
chunkyMonkey.bittersweet = [1, "cup, coarsely grated", "Callebaut"];   
console.dir(banana);   
console.dir(chunkyMonkey);

Open in new window


Could someone walk me through what this code does? Is this code block considered "Lazy Loading?"  I believe the code redefines the clone() function and then uses clone() to copy the Banana Object (and it's properties) into a new ice cream flavor called 'chunkyMonkey'.  I understand the end result, but don't understand the functions themselves.

Isn't Object.create() a native function? If so, why is it Undefined?
What is the .prototype property for Proxy doing? Why is Proxy.prototype being passed into the clone function?
0
I need to place a button on an editform which will set a value and then submit the form.
how do I do both of these things.  I can figure out how to set a value using jquery (or spjs-utility setFieldValue) - but how do I then tell sharepoint to save the record.
I have a list which is used to manage the business flow of records.  When they click "Submit for  reviewe" - I want to change the value of the status field (to "Submitted to for review") - and then save the record.
A workflow will trigger which handles the business logic for submitting to a reviewer, sending them an email, etc.
I would normally do all of this in InfoPath but InfoPath doesn't work with my server farm unfortunately due to some security rules we have.   This is easy in InfoPath of course.
0
Hi - i would like to add a new row to the table using javascript and i should add it only after clicking the add link.
The new row should be added after the row where the add button is selected.

my html is as below

<table id="detailTable" class="genTable" cellspacing="0"
								cellpadding="0">
<tr>
  <td class="ariallabelten green"><a class="ariallabelten green"
					href="javascript:add();">Add</td>
   <td><select name="first1">
  <option value="volvo">..</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select> </td>
  <td class="" width="390">
  <input type="text" name="lastname[]" value="" maxlength="40" size="64" ><br />
  </td>
</tr>
<tr>
    <td class="ariallabelten green"><a class="ariallabelten green"
					href="javascript:addcell();">Add</td>
					<td>
 <select name="first2">
  <option value="volvo">..</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select> </td>
  <td class="" width="390">
  <input type="text" name="lastname[]" value="" maxlength="40" size="64" ><br />
  </td>
</tr>
<tr>
  <td class="ariallabelten green"><a class="ariallabelten green"
					href="javascript:addcell();">Add</td>
	<td>	 <select name="first3">
  <option value="volvo">..</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select> </td>

Open in new window

0
i want to implement report(charts) with JSP.. Inventory reports...SIM order reports.. should be exported to pdf and excel formate
i need some example charts for my reference.
please provide some references.
0

jQuery

16K

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