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

Hello,
Im just trying to get to grips with using Modals and Bootstrap, can anyone look at :

http://dnx.org/eno/

And tell me why the button launches a modal, but the content is not replace with ajax content (from content.html )?


Thanks,
0
Application Discovery Service in AWS
Application Discovery Service in AWS

In the era of the cloud, customers migrating away from their existing on-premise infrastructure. This requires lots of planning, strategies, and effort to identify their existing resources and determine how best to migrate.  Datacenter migrations happen in four phases -

Greetings again,

I have this RadioButtonList control with a Yes or option in Repeater control.

                 Purchased:<asp:radiobuttonlist ID="rblType" runat="server" RepeatDirection="Horizontal" TextAlign="Right" style="display:inline;">
                 <asp:ListItem Text="New" />
                 <asp:ListItem Text="Used" />
                </asp:RadioButtonList>

Open in new window


All I am trying to do is to ensure that user chooses either Yes or No before continuing.

I have done a lot RadioButtonList validations but have not found anything that works with Repeater control.

Any ideas experts?
0
Hi all,

Hoping you can help me.  I would like to show a toolset on hover when hovering over any element with a certain class.
Do i need to embed the code every time, in each element, or can I just show it on hover. So perhaps have the toolset as a javascript snippet.

For e.g. the toolset could be:
<div>
  <ul>
    <li><a href="#">DRAG</a></li>
    <li><a href="#">DELETE</a></li>
  </ul>
</div

Open in new window

Of course it would be formatted with CSS.

And it would appear on top of any <div> element with the class 'tools'
<div class="tools">
  content
</div>

Open in new window


On hover of this div, the toolset would appear on top. There would be a range of div's with the same class on the page.
So the tools would allow editing of that div - in this above instance I could drag it around or delete the div area with jQuery.

Thanks
Paul
0
I have a working Jquery modal dialog which includes a form to collect a contacts address. At the top of the form is a drop down list which returns pre-defined addresses and a 'Use Address' button (id="signal).  The user can choose a pre-defined address if they wish and click the 'Use Address' button which takes the address values and pre-populates the form, thereby, saving the user from having to type in the address manually.

The html for modal form is
<div id="addcontact-window" title="Add Agency Contact">
    <div align="center">
    <p id="errors6"></p>
    </div>
    <form id="addcontactForm" name="addcontactForm" action="" method="post">
    <div id="addcontactFormBody"></div> 
    </form>
    </div>

Open in new window


The jquery code which declares/defines the dialog is:

$("#addcontact-window").dialog(
                        {
                        autoOpen: false,
                        maxWidth:850,
                        maxHeight: 700,
                        width: 850,
                        height: 700,
                        draggable: true,
                        modal: true,
                        buttons: {
                          "Save": function () 
                          { 
                          $.post("./add_agencycontact_process.php", $("#addcontactForm").serialize(), function(response)
                            {
                            if(!response)
                            {
                            

Open in new window

0
Before the Gridview at the bottom I need a button to add a new record but I can not figure out the html to make it work.

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Admin.aspx.cs" Inherits="Test.Admin" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <script type="text/javascript" lang="javascript">
        $(document).ready(function () {

            //Initialize the Account Termination Date datepicker
            $('#divDatePicker').datetimepicker({
                format: 'MM/DD/YYYY',
                useCurrent: false,
                minDate: new Date(),
                maxDate: new Date().setYear(new Date().getFullYear() + 1)
            });
           
            //Initialize the BootGrid
            $(function () {
                $('#<%= grdAdmin.ClientID %>').bootgrid({
                    caseSensitive: false,
                    formatters: {
                        "commands": function(column, row)
                        {
                            var buttonText;



                            buttonText = "<button type=\"button\" class=\"btn btn-xs btn-default command-add\" data-row-id=\"" + row.ID + "\"><span class=\"fa fa-camera\"></span></button>" +
                                "<button type=\"button\" class=\"btn btn-xs btn-default command-edit\" data-row-id=\"" + row.ID + "\"><span class=\"fa fa-pencil\"></span></button> " +
     …
0
I am struggling to get a handle on this problem.

I have a textbox on Gridview control:

<asp:TextBox ID="txtboatRegNo" style="width:270px;margin-left:195px;" runat="server"></asp:TextBox>

Open in new window


and a textbox on Repeater control:

<asp:TextBox ID="txtARegNo" style="width:270px;margin-left:195px;" runat="server"></asp:TextBox>

Open in new window


The values for both textbox controls are the same.

The current process asks user to enter his registration number on Griview and the click next to go next page.

On next page, there is a different set of requirements that asks user to once again, enter the same registration number.

We see this as being extremely inefficient.

So, we decided that once a user enters his/her registration number on txtboatRegNo on Gridview, that value should auto fill the txtARegNo on Repeater control.

So far, the following query is not working in that it is not auto filling the value enter in Gridview on the Repeater control.

Does anyone know how to resolve this?

This is the script I have been working with:

  <script type="text/javascript">
         $(function () {
             $('[id*=txtboatRegNo]').change(function () {
                 $('[id*=txtARegNo]').val(this.value);
             });
         });
 </script>

Open in new window


Thanks in advance
0
in my partial view, I have used some jquery code for submitting my form.but I got this error.
The required anti-forgery form field"__RequestVerificationToken"
is not present. as you see I have added @Html.AntiForgeryToken() in my partial view and as well I have added [ValidateAntiForgeryToken] on my controller. but I got the error again.I have read all of the questions on the internet but they couldn't help me.

@model Dentistry.Areas.ViewModels.UserViewModel

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
    </button>
    <h4 class="modal-title custom_align" id="Heading">ویرایش کاربران</h4>

</div>

@if (Model != null && Model.UserId != string.Empty)
{
    <div class="modal-body" id="editModal">
        <form id="#myForm">
          @Html.AntiForgeryToken()
            <div class="form-group">
                @Html.HiddenFor(a => a.UserId)
            </div>
            <div class="form-group">
                <label>نام کاربری</label>
                @Html.TextBoxFor(a => a.UserName, new { @class = "form-control" })
                @Html.ValidationMessageFor(a => a.UserName)
            </div>
            <div class="form-group">
                <label>نام</label>
                @Html.TextBoxFor(a => a.FirstName, new { @class = "form-control" })
                @Html.ValidationMessageFor(a => a.FirstName)
          

Open in new window

0
//This is my code for single file upload, i just want to make for multiple file uploads ..I want to save file names and file path using ","(comma) seperator..what changes i want to make??









    public ActionResult Index(int id)
        {
            Session["FileMsg"] = "";
            Session["ChangeCRFStatusMsg"] = "";
                  string referer = Request.ServerVariables["HTTP_REFERER"];
            if (string.IsNullOrEmpty(referer))
            {
                return RedirectToAction("Index", "Login");
            }
            else if (Session["Usercode"] != null)
            {
                ViewData["crfid"] = id;
                return View();
            }
            else
            {
                TempData["Error"] = " Your session has expired. Please log in again";
                return RedirectToAction("Index", "Login");
            }
        }

        /// <summary>
        /// This method is used to upload a file for a particular CRF.
        /// </summary>
        /// <param name="FileUpload">File</param>
        /// <param name="id">CRF Id</param>
        /// <returns></returns>
        [HttpPost]
        public ActionResult Index(HttpPostedFileBase FileUpload, HttpPostedFileBase addUpload, int id)
        {
            int crid = Convert.ToInt32(id);
            Session["FileMsg"] = "";
            Session["ChangeCRFStatusMsg"] = "";
            var validFileSize = 10 * 1024 * 1024;
            //string[] …
0
Hey folks. Web design and css is not my day job, more of a side hobby. That said I've been working iteratively on my site for a while now, and have worked myself into a corner when trying to make the site mobile friendly.

Overall I've had pretty good luck taking a two-column dynamic layout I tracked down a few years back and adapting it to mobile. I achieved the dynamic sizing for web with some nested divs that by necessity have a greater width than the window and need to be hidden, though.

On mobile, this only works if I assign overflow-x:hidden; to html,body. If I follow proper procedure and assign it, or the website scrolling setting, to document.body instead (or any other combination therein), the smooth scrolling is broken. I like the smooth scrolling, so even though it cost me the function of tapping the time bar to move to the top of the page, I went with it. It worked, right?

I accepted this compromise until I started to go further and taking my sidebar menus and try to make them fixed position nav menus for mobile. Even that worked fine until I created a logobar that would pop in upon scrolling away from the top of the page. The same compromise that broke "tap to top" has broken any JQuery scrollTop functions I tried to include, on mobile, using a simple enough technique I found here.

Now I have the choice, make any change at all to this css and lose smooth scrolling and gain my logobar and tap to top: as seen in test page 1
0
Hi Experts

Could you point how to workaraound this jquery error Uncaught Typerrror: Object values is not a function, acordingly with this code?


This code perfectly runs under most of the browsers:
    $('#last_operation').click(function () {
     
        // This perfectly returns an object
       	$.get("operation/syncronize_date", function(response){
       	    
            var dia_ultima_operacao = Object.values(response)[2];
            var usuario_ultima_replicacao = Object.values(response)[3];
            
  
            $("#ultima_operacao").val(usuario_ultima_operacao + " / "+ dia_ultima_operacao);

    	});
 
    });

Open in new window


But in an server's browser it simply returns the jQuery error.

Could you sugest a workaround code?

Thanks in advance.
0
[Live Webinar] The Cloud Skills Gap
LVL 4
[Live Webinar] The Cloud Skills Gap

As Cloud technologies come of age, business leaders grapple with the impact it has on their team's skills and the gap associated with the use of a cloud platform.

Join experts from 451 Research and Concerto Cloud Services on July 27th where we will examine fact and fiction.

I already set up webhook for twilio invoice, and the webhook webpage is voiceReceiver.aspx
and I want to receive and download the .mps to my server's hard drive.

How can i do that?

Thanks
0
I use query to do basic validation and now want to add runat to each html input, and hope to work with asp button.

And I no longer can use validationgrup any more on html side. Do you have any work around solution?
I want to use asp.button for sure with html input runat

Thanks,

<input class="search-field" runat="server" id="customCode" type="text" value=""/>
<asp:LinkButton ValidationGroup="form" runat="server" ID="submitAddNew" OnClick="submitAddNew_Click" CssClass="button preview">
Preview <i class="fa fa-arrow-circle-right"></i>
</asp:LinkButton>

Open in new window

0
I've actually been able to get this working on the editor in pages and posts using the code below. But haven't been able to get it to work for the new editor added to text widgets. I read that wordpress is using jQuery now for those text widgets, but even trying this without a hook, just adding the script sitewide to test doesn't work:

<script type="text/javascript">
jQuery( document ).on( 'tinymce-editor-setup', function( event, editor ) {
    if ( editor.settings.toolbar1 && -1 === editor.settings.toolbar1.indexOf( 'blockquote' ) ) {
        editor.settings.toolbar1 += ',blockquote';
    }
});
</script>

Open in new window


I tried that just to see if the new method wordpress says you can use to add more buttons would even affect the editor in the text widget, but it doesn't even add the blockquote icon as expected. So of course I can't poke around to try to figure out what would target the link option.

This is the code that does work for the editor in pages and posts:
<?php
function newtablink()
{
 ?>
<script type="text/javascript">
    jQuery(function () {
       jQuery('input#wp-link-target').prop('checked',true);
    });
</script>  
<?php
}

add_action( 'before_wp_tiny_mce', 'newtablink' );
?>

Open in new window


Anyone have any thoughts or suggestions on how to go about this for the widget? Below is a screenshot for a visual of where and what I'm trying to work with.
(If you wonder why we want to do this: we have some sites that have more external links than internal. So we want the people adding or editing content or widgets to be able to just enter the url without having to open in extra settings box. We don't want to add a plugin that automatically tries to auto add the target="_blank" as pages render because we want to still have individual control. Some of the people editing have very limited skills, so we want to try to simplify anything we can for some of the sites.)

Screenshot of the box that opens when adding a link in the editor.
0
I have an input button on the screen when clicked would allow me to select a file from the file system (desktop) and upon submit would upload the selected files. Now I am trying to add the drag and drop functionality as well. Will I be able to drag and drop files onto the input field directly, is that possible? Is there a JQuery plugin/lib that would enable me to convert the input tag to be able to accept files by simple Drag and drop process. If that is not possible I would appreciate if you could let me know of a way to achieve this.

A demo code would be of great help.
0
I created jstree using HTML using the UL and LI tags. I have an anchor tag with href and target attribute. However, when I click on the link, the target frame shows a "404 - File or directory not found." problem in the target frame. I noticed that when I do not use jstree, the link is displayed in the target.

This is the HTML.
<div id="jstree_div" class="dispTree">
<ul>
<li  class="jstree-open" id="node_1"><span class="topLevel">011-222-333</span>
<ul>    
<li id="ABCode2308830"><span class="linkLevel"><a href="index.cfm?fuseaction=DT2&IDN=2308830&idn=9999999" target="TrackRtFrame">SIOM-26</a></span>
</li>
<li id="ABCode2311493"><span class="linkLevel"><a href="index.cfm?fuseaction=DT2&IDN=2311493&idn=9999999" target="TrackRtFrame">Book Transcript 1</a></span></li>
<li id="ABCode2311495"><span class="linkLevel"><a href="index.cfm?fuseaction=DT2&IDN=2311495&idn=9999999" target="TrackRtFrame">Track 1</a></span>
</li></ul>
</li>
</ul>
</div>

This is the jstree code I am using:

$(function () {$.jstree.defaults.core.themes.variant = "small"; $.jstree.defaults.core.themes.dots = true; $('#jstree_div').jstree();

$("#jstree_div").bind("select_node.jstree", function(e, data) {     window.open(jQuery(data.event.originalEvent.originalTarget).attr   ('href'), 'TrackRtFrame');});});
0
Hi all,

please check this below link for reference
https://www.indiafilings.com/find-gst-rate

I want to make same search and browse page how to make please help.
0
I have a function which iterates through a list looking for a year value for each item.  Once it finds a match,  it gets the next "number" for naming an InfoPath file which then gets written to a document library.  Unfortunately for me,  I still don't have a feel for promises and defer and all that and cannot get past these issues.  If I run it in the debugger,  of course it all works as I stop at each step.  I tried adding some bogus delay loops and flags and still no luck.

I have copied the relevant snippets and they follow this note.  Any advise on this would be greatly appreciated.

Thanks!

      function GetNextNumber() {
		  var Bookings = myAJAX.ajaxGET("somesitecollection/_api/web/lists/getbytitle('Numbers')/items");
		  var nextNumber = '';
		  if (Bookings.results) {
			  nextNumber = Bookings.results[0].NextNumber
		  }
		  return nextNumber;
	  }
	  
	  
	  var incr = 2;
	  function UpdateNextNumber(pLastNumber) {
		  var sPrefix = pLastNumber.substring(0,1);
		  var sNumberpart = '';		  
		  sNumberpart = pLastNumber.substring(1,pLastNumber.length);
		  var nNextNumber = Number(sNumberpart) + incr;
		  var ns = String("00000" + nNextNumber).slice(-5)
		  var na = sPrefix + ns;
		  var itemProperties = {'NextAuditNumber':na};
		  updateListItem(_spPageContextInfo.webAbsoluteUrl,'NumberBooking',1,itemProperties,printInfo,logError);		  
	  }

      function GenerateSupplierRecs(sYear) {		  
		  var thisYear = Number(sYear);		  
		  var suppliers = 

Open in new window

0
Experts,

I am new to JS and jQuery. I have learned that you need jQuery in the code below to run a modal button.

For the most part, the below code works. What I am trying to accomplish is when you select the set of three @text modal buttons I would like for the end user to see the recipient field filled with testuser@cbatest.com and message field blank. What ultimately I want is for when the end-user hits submit, it actually sends the email with the above test account to the recpeint field and the message the end-user puts.

Can you show me how this is done?

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="robots" content="noindex, nofollow">
  <meta name="googlebot" content="noindex, nofollow">

<script type="text/javascript" src="https://code.jquery.com/jquery-git.js"></script>

    <link rel="stylesheet" type="text/css" href="/css/result-light.css">
    
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    
  

<style type="text/css">
    * {
  box-sizing: border-box;
}

#myInput {
  background-image: url('/css/searchicon.png');
  background-position: 10px 12px;
  background-repeat: no-repeat;
  width: 100%;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
  margin-bottom: 

Open in new window

0
I'm running scriptaculous.js Autocompleter in Magento and a paid-for theme which has a js file with :
jQuery(document).ready(function ($) {
    $(window).on('load resize change', function(event){
        Move();
    });

Open in new window

The Autocompleter returns by ajax a list of a-links, but with the code running above, the a-link doesn't respond to the first click, removing the 'change' from 'load resize change' fixes it. When I put a break on the DOM (Chrome tools) on click is firing although somehow the window.on('change') seems to be stealing it...?
I only fixed it by trial an error...any way you can see what's happening with the tools/
0
Secure Your WordPress Site: 5 Essential Approaches
Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

I have issue when i try to access

Like xxx.aspx/?data=123

And we have to keep this format

On google chrome - it seems working
In iE 11 - it alerts security something ...

How can be resolved?
0
Hi, all.

I'm hoping someone might be able to shed some light on a problem I'm having adding new items to a SharePoint Online list, using JSOM?

I have modified some code I found here and on stack exchange, the code works fine but, ONLY when I hard code the values I want in to the code. As soon as I try and use a variable that contains the values from the form, it fails with an unexpected error.

Can anyone offer any advice on why this is happening, please?


The lines in questions are below, like this they work:
    lmi.set_termLabel('IT');  - Line 24
    oListItem.set_item('Title', 'Test'); - Line 40 

Open in new window


If I change them to the below they stop working:

    lmi.set_termLabel(txtTerm); 
    oListItem.set_item('Title', txtTitle);

Open in new window



Full Code section:

   
function ExecuteTaxonomyFunctions(txtTitle,txtTerm)  
         {  
              var siteUrl = '/sites/rob';
        
        
              var context = new SP.ClientContext(siteUrl);   
              var list = context.get_web().get_lists().getByTitle("jQuery");  
            
              var field = list.get_fields().getByInternalNameOrTitle("Dept");  
              var txField = context.castTo(field, SP.Taxonomy.TaxonomyField);  
              context.load(field);  
              context.load(txField);  
              //Get the response from server to get the termsetId  
              context.executeQueryAsync(function(){  
                //Get the term set ID  
     

Open in new window

0
Hello,

I have a table on a page in SharePoint that was created in the dom through JavaScript.  I need to copy the HTML table.  How can I print the html of the interface?  It does not appear in the page source.  I even created it in fiddle and the page source does not show the HTML either.
Is there a way to print out the HTML so I can copy?  Thanks!

https://jsfiddle.net/isogunro/24v552vn/2/
0
I want to make sure user selects something from dropdown list, The value on top of list says "Select a course"
0
When saving the page, I'd make sure the textbox for ID has a value and not left empty.
should be 6 character length. Otherwise an alert will pop or write a message in the page that it is a required thing.
0
Imagine you have a text and that each and every word is an anchor link. When you click on one word, the dictionary pops up. This has been already implemented, and seems to work quite fine.

Now, the problem is that I would like users to be able to select phrases too. I have thought of this to work as follows:

1. click on one anchor element (not necessarily at the beginning of the word)
2. drag (and show current selection progress somehow)
3. drop on another anchor element

Any ideas on how to implement this using jQuery and HTML5?
1

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