Search Results

Search found 22556 results on 903 pages for 'jquery overlays plugin'.

Page 169/903 | < Previous Page | 165 166 167 168 169 170 171 172 173 174 175 176  | Next Page >

  • jQuery AJAX (google PageRank)

    - by RobertPitt
    Hey guys, I need a little help.. iv'e been developing a Jqery plug-in to get the page ranks of urls on a website using XHR, The problem is when requesting the rank from google servers the page is returned no content, but if i use an inspector and get the url that was requests and go to it via my browser the pageranks are shown. so it must be something with headers but its just got me puzzled. Heres some source code but i have removed several aspects that are not needed to review. pagerank.plugin.js ( $.fn.PageRank = function(callback) { var _library = new Object(); //Creat the system library _library.parseUrl = function(a) { var b = {}; var a = a || ''; /* * parse the url to extract its parts */ if (a = a.match(/((s?ftp|https?):\/\/){1}([^\/:]+)?(:([0-9]+))?([^\?#]+)?(\?([^#]+))?(#(.+))?/)) { b.scheme = a[2] ? a[2] : "http"; b.host = a[3] ? a[3] : null; b.port = a[5] ? a[5] : null; b.path = a[6] ? a[6] : null; b.args = a[8] ? a[8] : null; b.anchor = a[10] ? a[10] : null } return b } _library.ValidUrl = function(url) { var b = true; return b = url.host === undefined ? false : url.scheme != "http" && url.scheme != "https" ? false : url.host == "localhost" ? false : true } _library.toHex = function(a){ return (a < 16 ? "0" : "") + a.toString(16) } _library.hexEncodeU32 = function(a) { } _library.generateHash = function(a) { for (var b = 16909125, c = 0; c < a.length; c++) { } return _library.hexEncodeU32(b) } var CheckPageRank = function(domain,_call) { var hash = _library.generateHash(domain); $.ajax( { url: 'http://www.google.com/search?client=navclient-auto&ch=8'+hash+'&features=Rank&q=info:' + escape(domain), async: true, dataType: 'html', ifModified:true, contentType:'', type:'GET', beforeSend:function(xhr) { xhr.setRequestHeader('Referer','http://google.com/'); //Set Referer }, success: function(content,textS,xhr){ var d = xhr.responseText.substr(9, 2).replace(/\s$/, ""); if (d == "" || isNaN(d * 1)) d = "0"; _call(d); } }); } //Return the callback $(this).each(function(){ urlsegments = _library.parseUrl($(this).attr('href')) if(_library.ValidUrl(urlsegments)) { CheckPageRank(urlsegments.host,function(rank){ alert(rank) callback(rank); }); } }); return this; //Dont break any chain. } )(jQuery); Index.html (example) <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type="text/javascript" src="pagerank.plugin.js"></script> <script type="text/javascript"> $(document).ready(function() { $('a').PageRank(function(pr){ alert(pr); }) }); </script> </head> <body> <a href="http://facebook.com">a</a> <a href="http://twitter.com">a</a> <div></div> </body> </html> i just cant understand why its doing this.

    Read the article

  • Jquery calendar and tab sliding div clash...

    - by StealthRT
    Hey all, i am trying my best to figure out another way around this problem i seem to have encountered. On my website i have a jquery calendar and also a jquery div tab slider (this: http://www.queness.com/resources/html/tabmenu/jquery-tabbed-menu-queness.html). The problem comes into play with the DIV tag. The calender loads up inside a DIV with a id of 'calender'. The CSS for the tabs have the DIV hidden: CSS: .boxBody div {display:none;} .boxBody div.show {display:block;} .boxBody #category a {display:block;} And because of that, the calender never shows on the page. However, if i comment out that css code above, it shows up but does not cover each section as it should. In other words, everything is shown when it should be hidden until the tabs are clicked on to revel it. code: <script type="text/javascript"> $(document).ready(function() { $('#tabMenu > li').click(function(){ $('#tabMenu > li').removeClass('selected'); $(this).addClass('selected'); $('.boxBody div').slideUp('1500'); $('.boxBody div:eq(' + $('#tabMenu > li').index(this) + ')').slideDown('1500'); }).mouseover(function() { $(this).addClass('mouseover'); $(this).removeClass('mouseout'); }).mouseout(function() { $(this).addClass('mouseout'); $(this).removeClass('mouseover'); }); $('.boxBody #category li').mouseover(function() { $(this).css('backgroundColor','#888'); $(this).children().animate({paddingLeft:"20px"}, {queue:false, duration:300}); }).mouseout(function() { $(this).css('backgroundColor',''); $(this).children().animate({paddingLeft:"0"}, {queue:false, duration:300}); }); $('.boxBody li').click(function(){ window.location = $(this).find("a").attr("href"); }).mouseover(function() { $(this).css('backgroundColor','#888'); }).mouseout(function() { $(this).css('backgroundColor',''); }); }); </script> <div align="center"> <div class="Mainbox"> <ul id="tabMenu"> <div id="theLogo"><[img] src="img/theLogo.png" width="415" height="146" /></div> <li class="stats"><[img] src="img/Stats.png" width="70" height="52" id="tab1" /></li> <li class="cal"><[img] src="img/cal.png" width="70" height="52" id="tab2" /></li> <li class="loyalty"><[img] src="img/Loyalty.png" width="70" height="52" id="tab3" /></li> <li class="Employees"><[img] src="img/Employees.png" width="70" height="52" id="tab4" /></li> <li class="txtemail"><[img] src="img/TxtEmail.png" width="70" height="52" id="tab5" /></li> </ul> <div class="boxTop"></div> <div class="boxBody"> <div id="stats" class="show"> Just a test here.... </div> <div id="cal"> <div id='calendar'></div> </div> <div class="boxBottom"></div> </div> </div> How can i change the tab javascript code so that it does not have to hide the DIV's so that the calendar will work? I've tried to replace all div's with 'span' or 'p' but that does not seem to work at all. Any help would be great as i am stuck on this and can not go any further without it being solved! :) David

    Read the article

  • Update to Easy Slider 1.7 made all my JQuery code stop working.

    - by Anders H
    I'm pretty novice as a JQuery user goes. I've got some experience implementing different plugins but would be lost trying to customize my own. I can't share the exact site details with you due to a NDA, so I hope someone can give me a little help. I've got a project due today (Just HTML/CSS/JQuery). It has a lightbox, show/hide login menu and a slider is Easy Slider 1.5. Everything was working together, until I attempted to update to Easy Slider 1.7 (see link on same page, I'm too new to post more than 1 link). When I did so, JQuery stopped working for all the plugins. I've attempted to revert back to the original state, by undoing my work (didn't do much), ad JQuery remains broken. Firebug Error Console shared no errors. I can't find anything in the code no matter how hard I look at it. Can anyone help me troubleshoot this JQuery problem? Delivery is supposed to be tonight for the project. EDIT: Generic header info: <!-- Global Style Sheet --> <link rel="stylesheet" href="style.css" media="screen" type="text/css" /> <!-- Cufon --> <script src="cufon/cufon.js" type="text/javascript"></script> <script src="cufon/gotham_325-gotham_350.font.js" type="text/javascript"></script> <!-- jQuery Javascript --> <script type="text/javascript" language="javascript" src="js/jquery-1.3.2.min.js"></script> <script type="text/javascript" language="javascript" src="js/jquery-ui-1.7.1.custom.min.js"></script> <script type="text/javascript" language="javascript" src="js/jquery.colorbox.js"></script> <script type="text/javascript" language="javascript" src="js/global.js"></script> <script type="text/javascript" language="javascript" src="js/home.js"></script> <script type="text/javascript"> $(document).ready(function() { $(".signin").click(function(e) { e.preventDefault(); $("fieldset#signin_menu").toggle(); $(".signin").toggleClass("menu-open"); }); $("fieldset#signin_menu").mouseup(function() { return false }); $(document).mouseup(function(e) { if($(e.target).parent("a.signin").length==0) { $(".signin").removeClass("menu-open"); $("fieldset#signin_menu").hide(); } }); }); </script> <script src="javascripts/jquery.tipsy.js" type="text/javascript"></script> <script type='text/javascript'> $(function() { $('#forgot_username_link').tipsy({gravity: 'w'}); }); </script> <script type="text/javascript" language="javascript" src="js/easySlider1.5.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#slider").easySlider(); }); </script> <script type="text/javascript"> $(document).ready(function(){ $(".regbox").colorbox({iframe:true, innerWidth:270, innerHeight:270}); }); </script>

    Read the article

  • Using jQuery to call a web service

    - by Matt
    I have created a web service which takes a username and password as parameters and returns a list of children in JSON (the user is a Social Worker). The web service is hosted locally with IIS7. I am attempting to access the web service using javascript/jquery because it will eventually need to run as a mobile app. I'm not really experienced with web services, or javascript for that matter, but the following two links seemed to point me in the right direction: http://williamsportwebdeveloper.com/cgi/wp/?p=494 http://encosia.com/using-jquery-to-consume-aspnet-json-web-services/ This is my html page: <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.Master" AutoEventWireup="true" CodeBehind="TestWebService.aspx.cs" Inherits="Sponsor_A_Child.TestWebService" %> <asp:Content ID="Content1" ContentPlaceHolderID="stylesPlaceHolder" runat="server"> <script type="text/javascript" src="Scripts/jquery-1.7.1.js"> $(document).ready(function () { }); function LoginClientClick() { $("#query_results").empty(); $("#query_results").append('<table id="ResultsTable" class="ChildrenTable"><tr><th>Child_ID</th><th>Child_Name</th><th>Child_Surname</th></tr>'); $.ajax({ type: "POST", contentType: "application/json; charset=utf-8", url: "http://localhost/PhoneWebServices/GetChildren.asmx/GetMyChildren", data: '{ "email" : "' + $("#EmailBox").val() + '", "password": "' + $("#PasswordBox").val() + '" }', dataType: "json", success: function (msg) { var c = eval(msg.d); alert("" + c); for (var i in c) { $("#ResultsTable tr:last").after("<tr><td>" + c[i][0] + "</td><td>" + c[i][1] + "</td><td>" + c[i][2] + "</td></tr>"); } } }); } </script> </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="contentPlaceHolder" runat="server"> <div id="LoginDiv"> Email: <input id="EmailBox" type="text" /><br /> Password: <input id="PasswordBox" type="password" /><br /> <input id="LoginButton" type="button" value="Submit" onclick="LoginClientClick()" /> </div> <div id="query_results"> </div> </asp:Content> And this is my web service code: [WebMethod (Description="Returns the list of children for whom the social worker is responsible.")] public String GetMyChildren(String email,String password) { DataSet MyChildren=new DataSet(); int ID=SocialWorkerLogin(email, password); if (ID > 0) { MyChildren = FillChildrenTable(ID); } MyChildren.DataSetName = "My Children"; //To prevent 'DataTable name not set' error string[][] JaggedArray = new string[MyChildren.Tables[0].Rows.Count][]; int i = 0; foreach (DataRow rs in MyChildren.Tables[0].Rows) { JaggedArray[i] = new string[] { rs["Child_ID"].ToString(), rs["Child_Name"].ToString(), rs["Child_Surname"].ToString() }; i = i + 1; } // Return JSON data JavaScriptSerializer js = new JavaScriptSerializer(); string strJSON = js.Serialize(JaggedArray); return strJSON; } I followed the examples in the provided links, but when I press submit, only the table headers appear but not the list of children. When I test the web service on it's own though, it does return a JSON string so that part seems to be working. Any help is greatly appreciated :)

    Read the article

  • How add loading image using jquery?

    - by user244394
    I'm working on a form, <form id="myform" class="form"> </form> that gets submitted to the server using jquery ajax. How can I refresh the form on success to show the updated form information and add a spinner until the form loads? here is my html and jquery snippet <div class="container"> <div class="page-header"> <div class="span2"> <!--Sidebar content--> <img src="img/emc_logo.png" title="EMC" > </div> <div class="span6"> <h2 class="form-wizard-heading">Configuration</h2> </div> </div> <form id="myform" class="form"> </form> </div> <!-- /container --> <!-- Modal --> <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <h3 id="myModalLabel">Configuration Changes</h3> <p><span class="label label-important">Please review your changes before submitting. Submitting the changes will result in rebooting the cluster</span></p> </div> <div class="modal-body"> <table class="table table-condensed table-striped" id="display"></table> </div> <div class="modal-footer"> <button id="cancel" class="btn" data-dismiss="modal" aria-hidden="true">Close</button> <button id="save" class="btn btn-primary">Save changes</button> </div> </div> //Jquery part $(document).ready(function () { $('input').hover(function () { $(this).popover('show') }); // On mouseout destroy popout $('input').mouseout(function () { $(this).popover('destroy') }); $('#myform').on('submit', function (ev) { ev.preventDefault(); var data = $(this).serializeObject(); json_data = JSON.stringify(data); $('#myModal').modal('show'); $.each(data, function (key, val) { var tablefeed = $('<tr><td>' + key + '</td><td id="' + key + '">' + val + '</td><tr>').appendTo('#display'); }); $(".modal-body").html(tablefeed); }); $("#cancel").click(function () { $("#display").empty(); }); $(function () { $("#save").click(function () { // validate and process form here alert("button submitted" + json_data); $.ajax({ type: "POST", url: "somefile.json.", data: json_data, contentType: 'application/json', success: function (data, textStatus, xhr) { console.log(arguments); console.log(xhr.status); alert("Your form has been submitted: " + textStatus + xhr.status); }, error: function (jqXHR, textStatus, errorThrown) { alert(jqXHR.responseText + " - " + errorThrown + " : " + jqXHR.status); } }); }); }); });

    Read the article

  • jQuery tabs error when used with jTemplates

    - by tessa
    I am using jTemplates to format data returned from a json query. I am trying to transform the div with the id "fundingDialogTabs" into jQuery tabs after the template is processed. It renders the tab buttons, but both fragment1 and fragment2 divs are showing at the same time. I get the error "jQuery UI Tabs: Mismatching fragment identifier" when clicking on the fragment2 tab. I tested the jQuery tabs code outside of the template and it works fine. Here is the template (saved in .tpl file). {#template MAIN} <div style="width:500px"> <table border="0" cellpadding="0" cellspacing="0" id="fundingDialogTitle"> <tr> <td class="fundingDialogTitle">Funding Breakout</td> <td style="text-align:right"><img src="../../images/fscaClose.gif" onclick="CloseFundingDialog()" style="cursor:hand; width:25px; height:25px;"></td> </tr> </table> </div> <div style="padding:10px 10px 10px 10px; width:500px"> <div id="fundingDialogTabs"> <ul> <li><a href="#fragment1"><span>Source</span></a></li> <li><a href="#fragment2"><span>Line Item</span></a></li> </ul> <div id="fragment1"> <table border="0" cellpadding="0" cellspacing="0" id="fundingDialog"> <tr> <th>Funding Source</th> <th>Amount</th> </tr> {#foreach $T.d as fundingList} {#include ROW root=$T.fundingList} {#/for} </table> </div> <div id="fragment2"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </div> </div> </div> {#/template MAIN} {#template ROW} <tr> <td>{$T.SourceName}</td> <td>{$T.Amount}</td> </tr> {#/template ROW} Here are the json and processTemplate methods: function GetFundingDialog(id) { $.ajax({ type: "POST", url: "../../WebService/Workplan.asmx/GetFundingList", data: "{}", contentType: "application/json; charset=utf-8", dataType: "json", success: function(msg) { ApplyTemplate(msg, id); }, error: function(result) { ShowError(result.responseText); } }); } function ApplyTemplate(msg, id) { var fundingDialog = $("div[id='divFundingList']"); if (fundingDialog.length > 0) { fundingDialog.setTemplateURL('../../usercontrols/Workplan/FundingList.tpl'); fundingDialog.processTemplate(msg); fundingDialog[0].style.display = "block"; var src = $("img[id='openFundingList_"+id+"']"); if (src.length > 0) { var srcPosition = findPos(src[0]); fundingDialog[0].style.top = parseInt(srcPosition[1] + 25); } } $("#fundingDialogTabs").tabs(); }

    Read the article

  • jQuery not executed on page load

    - by Arild Sandberg
    I'm building an ajax upload with an editing function (rotate, zoom and crop), and I'm using guillotine by matiasgagliano (https://github.com/matiasgagliano/guillotine) for this. My problem is that after upload the user get redirected to the editing page through ajax, but when landing on that page I always have to refresh the page in browser for the image to load. I've tried auto-reloading, both through js and php, but that doesn't help, neither does adding a button to load the same url again. Only refresh from browser button (tested in several browsers) works. I've tried implementing jquery.turbolinks, but that stopped guillotine functions from working. I'm loading the guillotine.js in head section after jQuery, and have the function in bottom before body tag. Any tip or help would be appreciated. Thx Here is some of the code: HTML: <div class='frame'> <img id="id_picture" src="identifications/<?php echo $id_url; ?>" alt="id" /> </div> <div id='controls'> <a href='javascript:void(0)' id='rotate_left' title='<?php echo $word_row[434]; ?>'><i class='fa fa-rotate-left'></i></a> <a href='javascript:void(0)' id='zoom_out' title='<?php echo $word_row[436]; ?>'><i class='fa fa-search-minus'></i></a> <a href='javascript:void(0)' id='fit' title='<?php echo $word_row[438]; ?>'><i class='fa fa-arrows-alt'></i></a> <a href='javascript:void(0)' id='zoom_in' title='<?php echo $word_row[437]; ?>'><i class='fa fa-search-plus'></i></a> <a href='javascript:void(0)' id='rotate_right' title='<?php echo $word_row[435]; ?>'><i class='fa fa-rotate-right'></i></a> </div> Js: <script type='text/javascript'> jQuery(function() { var picture = $('#id_picture'); picture.guillotine({ width: 240, height: 180 }); picture.on('load', function(){ // Initialize plugin (with custom event) picture.guillotine({eventOnChange: 'guillotinechange'}); // Display inital data var data = picture.guillotine('getData'); for(var key in data) { $('#'+key).html(data[key]); } // Bind button actions $('#rotate_left').click(function(){ picture.guillotine('rotateLeft'); }); $('#rotate_right').click(function(){ picture.guillotine('rotateRight'); }); $('#fit').click(function(){ picture.guillotine('fit'); }); $('#zoom_in').click(function(){ picture.guillotine('zoomIn'); }); $('#zoom_out').click(function(){ picture.guillotine('zoomOut'); }); $('#process').click(function(){ $.ajax({ type: "POST", url: "scripts/process_id.php?id=<?php echo $emp_id; ?>&user=<?php echo $user; ?>", data: data, cache: false, success: function(html) { window.location = "<?php echo $finish_url; ?>"; } }); }); // Update data on change picture.on('guillotinechange', function(ev, data, action) { data.scale = parseFloat(data.scale.toFixed(4)); for(var k in data) { $('#'+k).html(data[k]); } }); }); }); </script>

    Read the article

  • Doing a roll-in/roll-out slideshow in jQuery

    - by erizias
    I am trying to create a roll-in / roll-out slideshow in jQuery/JavaScript. My problem is, that it needs to be repeated. And right now when it's starting over, the pictures doesnt come from the right side anymore :( The reason for which I have created the slideLeft function, is that afterwards I need to create 2 functions, where the user can interrupt the slideshow manually pressing a left or right button. This is what I've got: <script class="jsbin" src="http://code.jquery.com/jquery-1.7.2.min.js"></script> <div style='background: #c4c4c4; border: 1px solid #7b7b7b; height: 220px; overflow: hidden; padding: 5px; position: absolute; width: 590px;'> <div id='slider-image-1' style='left: 5px; background: red; height: 216px; padding: 2px; position: absolute; top: 5px; width: 586px;'></div> <div id='slider-image-2' style='left: 600px; background: yellow; height: 216px; padding: 2px; position: absolute; top: 5px; width: 586px;'></div> <div id='slider-image-3' style='left: 600px; background: green; height: 216px; padding: 2px; position: absolute; top: 5px; width: 586px;'></div> <div id='slider-image-4' style='left: 600px; background: blue; height: 216px; padding: 2px; position: absolute; top: 5px; width: 586px;'></div> </div> <script type='text/javascript'> $(document).ready(function() { var amount = 0; var nextamount = 1; setInterval(function() { amount++; nextamount++; if (nextamount === 5) nextamount = 1; if (amount === 5) amount = 1; slideLeft(amount, nextamount); }, 2000); }); function slideLeft(i, j) { var $theItem = $('#slider-image-' + i); $theItem.animate({ left: parseInt($theItem.css('left'), 10) == 5 ? -$theItem.outerWidth() : 5 }, 500); var $theItem = $('#slider-image-' + j); $theItem.animate({ left: parseInt($theItem.css('left'), 10) == 5 ? $theItem.outerWidth() + 10 : 5 }, 500); }; </script>

    Read the article

  • optimizing the jquery in django

    - by sankar
    I have done the following code which actually dynamically generate the values in the third list box using ajax and jquery concepts. Thoug it works, i need to optimize it. Below is the code i am working on now. <html> <head> <title>Comparison based on ID Number</title> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> {% if form.errors %} <p style="color: red;"> Please correct the error{{ form.errors|pluralize }} below. </p> {% endif %} <form action="/idnumber/" method="post" align= "center">{% csrf_token %} <p>Select different id numbers and the name of the <b> Measurement Group </b>to start the comparison</p> <table align = "center"> <tr> <th><label for="id_criteria_1">Id Number 1:</label></th> <th> {{ form.idnumber_1 }} </th> </tr> <tr> <th><label for="id_criteria_2">Id Number 2:</label></th> <th> {{ form.idnumber_2 }} </th> </tr> <tr> <th><label for="group_name_list">Group Name:</label></th> <th><select name="group_name_list" id="id_group_name_list"> <option>Select</option> </select> </th> </tr> <script> $('#id_idnumber_2').change( function get_group_names() { var value1 = $('#id_idnumber_1').attr('value'); var value2 = $(this).attr('value'); alert(value1); alert(value2); var request = $.ajax({ url: "/getGroupnamesforIDnumber/", type: "GET", data: {idnumber_1 : value1,idnumber_2 : value2}, dataType: "json", success: function(data) { alert(data); var myselect = document.getElementById("group_name_list"); document.getElementById("group_name_list").options.length = 1; var length_of_data = data.length; alert(length_of_data); try{ for(var i = 0;i < length_of_data; i++) { myselect.add(new Option(data[i].group_name, "i"), myselect.options[i]) //add new option to beginning of "sample" } } catch(e){ //in IE, try the below version instead of add() for(var i = 0;i < length_of_data; i++) { myselect.add(new Option(data[i].group_name, data[i].group_name)) //add new option to end of "sample" } } } }); }); </script> <tr align = "center"><th><input type="submit" value="Submit"></th></tr> </table> </form> </body> </html> everything works fine but there is a little problem in my code. (ie) my ajax function calls only when there is a change in the select list 2 (ie) 'id_number_2'. I want to make it call in such a way that which ever select box, the third list box should be updated automatically. Can anyone please help me on this with a possible logical solution

    Read the article

  • JQuery form sticks with the ajax indicator on and won't submit

    - by Steven Buick
    Hi, I'm using JQuery 1.3 to validate and submit a form to a PHP page which JSON encodes a server response to display on the original form page. I've tried submitting the form without the JQuery part and everything seems to work fine but when I add JQuery it doesn't submit and constantly displays the ajax indicator. Here's my code: $(document).ready(function(){ var options = { target: '#messagebox', url: 'updateregistration.php', type:'POST', beforeSubmit: validatePassword, success: processJson, dataType: 'json' }; $("form:not(.filter) :input:visible:enabled:first").focus(); $("#webmailForm").validate({ errorLabelContainer: "#messagebox", rules: { forename: "required", surname: "required", currentpassword: "required", directemail: { required: true, email: true }, directtelephone: "required" }, messages: { forename: { required: "Please enter your forename" }, directemail: { required: "Please enter your direct e-mail address", email: "Your e-mail address does not appear to be valid(Example: [email protected])" }, surname: { required: "Please enter your surname" }, directtelephone: { required: "Please enter your direct telephone number" }, currentpassword: { required: "Please enter your current password" } } }); $('#webmailForm').submit(function() { $('#ajaxindicator').show(); $(this).ajaxSubmit(options); return false; }); }); function processJson(data) { $("#webmailForm").fadeOut("fast"); $("#messagebox").fadeIn("fast"); $("#messagebox").css({'background-image' : 'url(../images/messageboxbackgroundgreen.png)','border-color':'#009900','border-width':'1px','border-style':'solid'}); var forename=data.forename; var surname=data.surname; var directemail=data.directemail; var directphone=data.directphone; var dateofbirth=data.dateofbirth; var companyname=data.companyname; var fulladdress=data.fulladdress; var telephone=data.telephone; var fax=data.fax; var email=data.email; var website=data.website; var fsanumber=data.fsanumber; var membertype=data.membertype; var network=data.network; $("#messagebox").html('<h3>Registration Update successful!</h3>' + '<p><strong>Member Type:</strong> ' + membertype + '<br>' + '<strong>Forename:</strong> ' + forename + '<br><strong>Surname:</strong> ' + surname + '<br><strong>Direct E-mail:</strong> ' + directemail + '<br><strong>Direct Phone:</strong> ' + directphone + '<br><strong>Date of Birth:</strong> ' + dateofbirth + '<br><strong>Company:</strong> ' + companyname + '<br><strong>Address:</strong> ' + fulladdress + '<br><strong>Telephone:</strong> ' + telephone + '<br><strong>Fax:</strong> ' + fax + '<br><strong>E-mail:</strong> ' + email + '<br><strong>Website:</strong> ' + website + '<br><strong>FSA Number:</strong> ' + fsanumber + '<br><strong>Network:</strong> ' + network + '</p>'); $('#ajaxindicator').hide(); } function validatePassword(){ var clientpassword=$("#clientpassword").val(); var currentpassword=$("#currentpassword").val(); var currentpasswordmd5=hex_md5(currentpassword); if (currentpasswordmd5!=clientpassword){ $("#messagebox").html("You input the wrong current password, please try again."); $('#ajaxindicator').hide(); return false; } } I have a disabled textbox and some hidden ones. Could this be the problem?

    Read the article

  • Problem with Json in Jquery

    - by Davidslv
    Hi everyone, I have a small survey, but when i submit it says that the msg is null, i don't see where is my error. If you could help me i apreciate it. Thank you My Form with Jquery and Ajax Function <!DOCTYPE HTML> <hmtl lang="pt-PT"> <head> <title>Formul&aacute;rio</title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> </head> <body> <hr /> <h3>Formulario</h3> <script type="text/javascript" charset="utf-8"> $(function () { $('#submiter').click( function() { $.ajax({ type: "POST", url: 'validar.php', dataType: 'json', success: function(msg) { alert('Mensagem '+ msg.mensagem); }, error : function () { alert('Ocorreu um erro'); } }); }); }); </script> <form id="formulario" action="" method="post" accept-charset="utf-8"> <p>Pergunta 1</p> <label for="pergunta1">sim</label><input type="radio" id="p1" name="pergunta1" value="1" /><br /> <label for="pergunta1">n&atilde;o</label><input type="radio" id="p1" name="pergunta1" value="0" /> <br /> <p>Pergunta 2</p> <label for="pergunta2">sim</label><input type="radio" name="pergunta2" value="0" /><br /> <label for="pergunta2">n&atilde;o</label><input type="radio" name="pergunta2" value="1" /> <br /> <p>Pergunta 3</p> <label for="pergunta3">sim</label><input type="radio" name="pergunta3" value="0" /><br /> <label for="pergunta3">n&atilde;o</label><input type="radio" name="pergunta3" value="1" /> <br /> <p>Pergunta 4</p> <label for="pergunta4">sim</label><input type="radio" name="pergunta4" value="0" /><br /> <label for="pergunta4">n&atilde;o</label><input type="radio" name="pergunta4" value="1" /> <br /> <p><input type="submit" id="submiter" value="Continue &rarr;"></p> </form> </body> </html> My PHP <?php if($_POST) { $pergunta1 = $_POST['pergunta1']; $pergunta2 = $_POST['pergunta2']; $pergunta3 = $_POST['pergunta3']; $pergunta4 = $_POST['pergunta4']; $calcular = $pergunta1 + $pergunta2 + $pergunta3 + $pergunta4; $var = array ('mensagem' => $calcular); echo json_encode($var); } else { $var2 = array('mensagem' => 'sem resultado'); echo json_encode($var2); } ?>

    Read the article

  • jquery mouse events masked by img in IE8 - all other platforms/browsers work fine

    - by Bruce
    Using the jQuery mouse events for mouseenter, mouseleave or hover all work swimmingly on all Mac or Windows browsers except for IE8/Windows. I am using mouseenter and mouseleave to test for hot rectangles (absolutely positioned and dimensioned divs that have no content) over an image used as hotspots to make visible the navigation buttons when different regions of the main enclosing rectangle (image) are touched by the cursor. Windows/IE jQuery never sends notifications (mouseenter our mouseleave) as the cursor enters or exits one of the target divs. If I turn off the visibility of the image everything works as expected (like it does in every other browser), so the image is effectively blocking all messages (the intention was for the image to be a background and all the divs float above it, where they can be clicked on). I understand that there's a z-index gotcha (so explicitly specifying z-index for each absolute positioned div does not work), but unclear as to how to nest or order multiple divs to allow a single set of jQuery rules to support all browsers. The image tag seems to trump all other divs and always appear in front of them... BTW: I could not use i m g as a tag in this text so it is spelled image in the following, so the input editor does not think that I am trying to pull a fast one on stackoverflow... How used? "mainview" is the background image, "zoneleft" and "zoneright" are the active areas where when the cursor enters the nav buttons "leftarrow" and rightarrow" are supposed to appear. Javascript $("div#zoneleft").bind("mouseenter",function () // enters left zone see left arrow { arrowVisibility("left"); document.getElementById("leftarrow").style.display="block"; }).bind("mouseleave",function () { document.getElementById("leftarrow").style.visibility="hidden"; document.getElementById("rightarrow").style.visibility="hidden"; }); HTML <div id="zoneleft" style="position:absolute; top:44px; left:0px; width:355px; height:372px; z-index:40;"> <div id="leftarrow" style="position:absolute; top:158px; left:0px; z-index:50;"><img src="images/newleft.png" width="59" height="56"/></div></div> <div id="zoneright" style="position:absolute; top:44px; left:355px; width:355px; height:372px; z-index:40;"> <div id="rightarrow" style="position:absolute; top:158px; left:296px; z-index:50;"> (tag named changed so that I could include it here) <image src="images/newright.png" width="59" height="56" /></div></div> </div><!-- navbuttons --> <image id="mainview" style="z-index:-1;" src="images/projectPhotos/photo1.jpg" width:710px; height:372px; /> (tag named changed so that I could include it here) </div><!--photo-->

    Read the article

  • jquery live problem

    - by Kay
    Hi, I have a website which uses jquery and lots of mouseover/mouseout effect. So far I used the .bind() method of jquery but if you have 1000 event handlers, this is slowing down your browser a lot. So, I want to move to use .live or .delegate. One part of my portal site is a chat area. User can set chat messages which will then be displayed in a simple table. There is a feature that if you move the mouse over a chat message a trash can will appear allowing you to delete the message (if it is by you or you are a moderator). The trash bin is in the same table cell as the chat message. The problem: Using .bind() it worked like a charm. This is the old code: function CreateChatMessageContextMenu(ctrl, messageID, message, sender) { var a = document.createElement("a"); a.href = "javascript:RemoveChatMessage(" + messageID + ");" a.id = 'aDeleteChatMessage' + messageID; a.style.display = 'none'; var img = document.createElement("span"); img.className = "sprite-common messages-image sprite-common-btnDelete"; a.appendChild(img); ctrl.appendChild(a); $(ctrl) .bind('mouseover', function(event) { $('#aDeleteChatMessage' + messageID).show() }) .bind('mouseout', function(event) { $('#aDeleteChatMessage' + messageID).hide() }); return; } 'ctrl' is the reference to a table cell. Now, using .live() the trashbin also appears but it is flickering a lot and when I move the mouse over the trashbin, it is disappearing or inactive. I have the feeling that more events are thrown or something. It seems like the 'mouseout' is thrown when moving over the trashbin, but the thrashbin is inside the tablecell so mouseout should not be triggered. The new code is as follows. $(document).ready { $('.jDeleteableChatMessage').live('mouseover mouseout', function(event) { var linkID = '#aDelete' + event.target.id; if (event.type == 'mouseover') { $(linkID).show(); } else { $(linkID).hide(); } return false; }); } function CreateChatMessageContextMenu(ctrl, messageID, message, sender) { if (!UserIsModerator && (UserLogin != sender)) return; ctrl.id = 'ChatMessage' + messageID; var deleteString = 'Diese Chatnachricht löschen'; if (UserLang == '1') deleteString = 'Delete this chat message'; var a = document.createElement("a"); a.href = "javascript:RemoveChatMessage(" + messageID + ");" a.id = 'aDeleteChatMessage' + messageID; a.style.display = 'none'; var img = document.createElement("span"); img.className = "sprite-common messages-image sprite-common-btnDelete"; img.alt = deleteString; img.title = deleteString; a.appendChild(img); ctrl.appendChild(a); $(ctrl).addClass('jDeleteableChatMessage'); } I add a class to tell jQuery which chat cell have a trash bin and which don't. I also add an ID to the table cell which is later used to determine the associated trash bin. Yes, that's clumsy data passing to an event method. And, naturally, there is the document.ready function which initialises the .live() method. So, where is my mistake?

    Read the article

  • How to Load In Content with jQuery?

    - by ClarkSKent
    Hello, I am trying to add ajax functionality to my pagination so the content loads in the same page instead of the user having to navigate to another page when clicking the page links. I should mention that I am using this php pagination class. Being new to jquery, I am unsure of how to properly do this with the pagination class. This is what the main page looks like: <?php $categoryId=$_GET['category']; echo $categoryId; ?> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type="text/javascript" src="jquery_page.js"></script> <?php //Include the PS_Pagination class include('ps_pagination.php'); //Connect to mysql db $conn = mysql_connect('localhost', 'root', 'root'); mysql_select_db('ajax_demo',$conn); $sql = "select * from explore where category='$categoryId'"; //Create a PS_Pagination object $pager = new PS_Pagination($conn, $sql, 3, 11, 'param1=value1&param2=value2'); //The paginate() function returns a mysql //result set for the current page $rs = $pager->paginate(); //Loop through the result set echo "<table width='800px'>"; while($row = mysql_fetch_assoc($rs)) { echo "<tr>"; echo"<td>"; echo $row['id']; echo"</td>"; echo"<td>"; echo $row['site_description']; echo"</td>"; echo"<td>"; echo $row['site_price']; echo"</td>"; echo "</tr>"; } echo "</table>"; echo "<ul id='pagination'>"; echo "<li>"; //Display the navigation echo $pager->renderFullNav(); echo "</li>"; echo "</ul>"; ?> <div id="loading" ></div> <div id="content" ></div> <a href="#" class="category" id="marketing">Marketing</a> <a href="#" class="category" id="automotive">Automotive</a> <a href="#" class="category" id="sports">Sports</a> Any help on this would be great. Thanks.

    Read the article

  • Display comments from a Facebook page link on my site's post page

    - by kindofabigdeal
    I am not sure if this is doable, but whenever I post a bit of news on my site, I will post a link on my Facebook fan page. Lately, I've noticed the whole discussion is happening on Facebook, with comments there being way bigger in numbers than on my page. I notice FB has a Social Comments plugin. I was wondering if there was a way to embed comments from my Facebook fan page for a specific link with that plugin or any way otherwise?

    Read the article

  • Overlays with MkMapView do not scroll smoothly

    - by Chase
    By overriding the drawrect of my MkAnnotationViews, I am displaying paths using CoreGraphics. The problem I have is when I zoom in pretty close and scroll the map view, the paths drawn by CoreGraphics seem to be really jumpy, as if they are updated only after a shift of three or more pixels. When zoomed out, the scrolling is perfectly smooth and is reflected for each pixel shift. The drawrect function is not called during this scrolling as I assume mkmapkit is just applying translations on the existing views. Any ideas how to smooth this out or why this is happening?

    Read the article

  • google maps api v3 - loop through overlays - overlayview methods

    - by user317005
    what's wrong with the code below? when i execute it, the map doesn't even show up. but when i put the overlayview methods outside the for-loop and manually assign a lat/lng then it magically works?! but does anyone know how i can loop through an array of lats/lngs (=items) using the overlayview methods? i hope this makes sense, just don't know how else to explain it. and unfortunately, i run my code on my localhost var overlay; OverlayTest.prototype = new google.maps.OverlayView(); [taken out: options] var map = new google.maps.Map(document.getElementById('map_canvas'), options); var items = [ ['lat','lng'],['lat','lng'] ]; for (var i = 0; i < items.length; i++) { var latlng = new google.maps.LatLng(items[i][0], items[i][1]); var bounds = new google.maps.LatLngBounds(latlng); overlay = new OverlayTest(map, bounds); function OverlayTest(map, bounds) { [taken out: not important] this.setMap(map); } OverlayTest.prototype.onAdd = function() { [taken out: not important] } OverlayTest.prototype.draw = function() { [taken out: not important] } }

    Read the article

  • Firefox extension that overlays persistent iFrame?

    - by Crashalot
    Is it possible to build a Firefox extension that displays a floating, persistent iFrame over the page content? I know it's possible to add iFrames using XUL. For instance, you can add an iFrame to a persistent sidebar. However, I want the iFrame to float over the page content, not cause the content to shrink. So far, my only option is to add the iFrame to the DOM, then use CSS "fixed" positioning to float the iFrame. The iFrame must also persist across page loads, exactly as the sidebar does. Adding an iFrame to the DOM, unfortunately, causes the iFrame to vanish when the browser renders a new page (e.g., after clicking a link). Any clues? Thanks!

    Read the article

  • jQueryMobile: how to work with slider events?

    - by balexandre
    I'm testing the slider events in jQueryMobile and I must been missing something. page code is: <div data-role="fieldcontain"> <label for="slider">Input slider:</label> <input type="range" name="slider" id="slider" value="0" min="0" max="100" /> </div> and if I do: $("#slider").data("events"); I get blur, focus, keyup, remove What I want to do is to get the value once user release the slider handle and having a hook to the keyup event as $("#slider").bind("keyup", function() { alert('here'); } ); does absolutely nothing :( I must say that I wrongly assumed that jQueryMobile used jQueryUI controls as it was my first thought, but now working deep in the events I can see this is not the case, only in terms of CSS Design. What can I do? jQuery Mobile Slider source code can be found on Git if it helps anyone as well a test page can be found at JSBin As I understand, the #slider is the textbox with the value, so I would need to hook into the slider handle as the generated code for this slider is: <div data-role="fieldcontain" class="ui-field-contain ui-body ui-br"> <label for="slider" class="ui-input-text ui-slider" id="slider-label">Input slider:</label> <input data-type="range" max="100" min="0" value="0" id="slider" name="slider" class="ui-input-text ui-body-null ui-corner-all ui-shadow-inset ui-body-c ui-slider-input" /> <div role="application" class="ui-slider ui-btn-down-c ui-btn-corner-all"> <a class="ui-slider-handle ui-btn ui-btn-corner-all ui-shadow ui-btn-up-c" href="#" data-theme="c" role="slider" aria-valuemin="0" aria-valuemax="100" aria-valuenow="54" aria-valuetext="54" title="54" aria-labelledby="slider-label" style="left: 54%;"> <span class="ui-btn-inner ui-btn-corner-all"> <span class="ui-btn-text"></span> </span> </a> </div> </div> and checking the events in the handler anchor I get only the click event $("#slider").next().find("a").data("events");

    Read the article

  • Android Map Performance poor because of many Overlays?

    - by Dave
    Hi, I have a map in my android application that shows many markers (~20-50). But the app performs very poor when i try to scroll/zoom (in Google Android Maps i did a sample search for pizza and there were also some 20-50 results found and i didn't notice any particular performance problems when zooming/scrolling through the map). Here is my (pseudo)code: onCreate() { .... drawable = this.getResources().getDrawable(R.drawable.marker1); itemizedOverlay = new MyItemizedOverlay(drawable,mapView); ... callWebServiceToRetrieveData(); createMarkers(); } createMarkers(){ for(elem:bigList){ GeoPoint geoPoint = new GeoPoint((int)(elem.getLat()*1000000), (int) (elem.getLon()*1000000)); OverlayItem overlayItem = new OverlayItem(geoPoint, elem.getName(), elem.getData()); itemizedOverlay.addOverlay(overlayItem); mapOverlays.add(itemizedOverlay); } mapView.invalidate(); } the MyItemizedOverlay.addOverlay looks like this: public void addOverlay(OverlayItem overlay) { m_overlays.add(overlay); populate(); }

    Read the article

  • Are tile overlays possible with the iPhone's MapKit

    - by rickharrison
    I already have a tile source set up for use with the Google Maps JavaScript API. I am trying to translate this for use with the iPhone MapKit. I have correctly implemented the javascript zooming levels into mapkit. Whenever - (void)mapView:(MKMapView *)mapView regionDidChangeAnimated:(BOOL)animated is called, I snap the region to the nearest zoom level based on the same center point. Is it possible to implement a solution possibly with CATiledLayer to implement a tiling solution. Does the iPhone use the standard 256x256 tiles like google maps does natively? Any direction or help on this would be greatly appreciated. I would rather not waste a couple weeks trying to implement this if it's not possible.

    Read the article

  • Efficient Map Overlays in on Android Google Map...

    - by Ahsan
    Hi Friends, I want to do the following and am kind of stuck on these for a few days.... 1) I have used helloItemizedOverlay to add about 150 markers and it gets very very slow.....any idea what to do ? I was thinking about threads....(handler) ... 2) I was trying to draw poly lines ( I have encoded polylines, but have managed to decoded those) that move when I move the map.....(the only solution that I found was for Geopoints to be transformed into screen co-ordinates...which wont move if I move the map !) 3) I was looking for some sort of a timer function that executes a given function, say, every 1 minute or so.... 4) I was also looking for ways to clear the Google map from all the markers/lines etc.... Thanks a lot... :) - ahsan

    Read the article

  • Dynamic Overlays slowing down Google Maps (Android 2.1) on Nexus One

    - by Soumya Simanta
    Hi, I'm trying to create a dynamic ItemizedOverylay (please see the code below) on Google Maps (Android 2.1) on a Nexus One. In my Activity (that extends MapActivity) I'm creating a data thread that is receiving data from the network. A 'handler' is used to communicate the data from the receiving thread to map activity. This data contains the locations (lat, lon) of the markers that I want to overlay on my map. The location of each marker is dynamic (i.e., it changes every time I receive new data from the network.) refreshItems(ArrayList<OverlayItem> newItems) method in invoked inside the handleMessage() of the handler. There are around 11 markers in the ArrayList that is passed to refreshItems I can see the markers overlayed on the map. However, I've two issues: The old markers are not removed from the map. After a while I see a trail of markers. The map doesn't respond to any touch commands. I cannot move the map or zoom in or zoom out. After a while I see a system warning that my app is not responding message. Any idea what's wrong here ? Thanks. public class MyItemizedOverlay extends ItemizedOverlay { private ArrayList<OverlayItem> overlayItems; public CoTItemizedOverlay(Drawable defaultMarker) { super(boundCenter(defaultMarker)); overlayItems = new ArrayList<OverlayItem>(); populate(); } public void addNewItem(GeoPoint location, String markerText, String snippet) { overlayItems.add(new OverlayItem(location, markerText, snippet)); populate(); } public void removeItem(int index) { overlayItems.remove(index); populate(); } public void refreshItems(ArrayList<OverlayItem> newItems) { // remove all existing items for (int i = 0; i < cotoverlayItems.size(); i++) { overlayItems.remove(i); } // copy all the times if (newItems != null && cotoverlayItems.size() == 0) { overlayItems.addAll(newItems); } populate(); } @Override protected OverlayItem createItem(int index) { return overlayItems.get(index); } @Override public int size() { return overlayItems.size(); } }

    Read the article

  • The maven assembly plugin is not using the finalName for installing with attach=true?

    - by Roland Wiesemann
    I have configured following assembly: <build> <plugins> <plugin> <artifactId>maven-assembly-plugin</artifactId> <version>2.2-beta-5</version> <executions> <execution> <id>${project.name}-test-assembly</id> <phase>package</phase> <goals> <goal>single</goal> </goals> <configuration> <appendAssemblyId>false</appendAssemblyId> <finalName>${project.name}-test</finalName> <filters> <filter>src/assemble/test/distribution.properties</filter> </filters> <descriptors> <descriptor>src/assemble/distribution.xml</descriptor> </descriptors> <attach>true</attach> </configuration> </execution> <execution> <id>${project.name}-prod-assembly</id> <phase>package</phase> <goals> <goal>single</goal> </goals> <configuration> <appendAssemblyId>false</appendAssemblyId> <finalName>${project.name}-prod</finalName> <filters> <filter>src/assemble/prod/distribution.properties</filter> </filters> <descriptors> <descriptor>src/assemble/distribution.xml</descriptor> </descriptors> <attach>true</attach> </configuration> </execution> </executions> </plugin> </plugins> </build> This produced two zip-files: distribution-prod.zip distribution-test.zip My expectation for the property attach=true is, that the two zip-files are installed with the name as given in property finalName. But the result is, only one file is installed (attached) to the artifact. The maven protocol is: distrib-0.1-SNAPSHOT.zip distrib-0.1-SNAPSHOT.zip The plugin is using the artifact-id instead of property finalName! Is this a bug? The last installation is overwriting the first one. What can i do to install this two files with different names? Thanks for your investigation. Roland

    Read the article

< Previous Page | 165 166 167 168 169 170 171 172 173 174 175 176  | Next Page >