Search Results

Search found 17356 results on 695 pages for 'document ready'.

Page 122/695 | < Previous Page | 118 119 120 121 122 123 124 125 126 127 128 129  | Next Page >

  • Greasemonkey script, that creates Kineticjs drag and drop canvas over every website

    - by Michael Moeller
    I'd like to put a drag and drop canvas over every website I visit in Firefox. My Greasemonkey script puts a drag and drop canvas under every page: kinetic.user.js: // ==UserScript== // @name kineticjs_example // @description Canvas Drag and Drop // @include * // @require http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js // @require http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.7.2.min.js // ==/UserScript== var div = document.createElement( 'div' ); with( div ) { setAttribute( 'id', 'container' ); } // append at end document.getElementsByTagName( 'body' )[ 0 ].appendChild( div ); var stage = new Kinetic.Stage({ container: 'container', width: 1000, height: 1000 }); var layer = new Kinetic.Layer(); var rectX = stage.getWidth() / 2 - 50; var rectY = stage.getHeight() / 2 - 25; var box = new Kinetic.Rect({ x: rectX, y: rectY, width: 100, height: 50, fill: '#00D2FF', stroke: 'black', strokeWidth: 4, draggable: true }); // add cursor styling box.on('mouseover', function() { document.body.style.cursor = 'pointer'; }); box.on('mouseout', function() { document.body.style.cursor = 'default'; }); layer.add(box); stage.add(layer); How can I drag and drop this shape over the entire website?

    Read the article

  • Facebook call back function with timeout

    - by Dirty Bird Design
    So I've been getting my ass kicked pretty good with Facebook's moving target of an API. I need to display some hidden content after a person clicks 'like' on a landing page. I can somewhat get this to work, when the user clicks 'like' the normal fb dialogue appears and then goes away immediately and content is displayed. I have 'achieved' this with the following js. <script> FB.Event.subscribe('edge.create', function(href, widget) { document.getElementById('goodies').style.display = "block"; document.getElementById('fb-content').style.display= "block"; document.getElementById('copy').style.display = "none"; }); </script> I cannot find any documentation about a callback event after someone hits "post to facebook" or after the dialogue closes, only afte they hit like. How would I incorporate a setTimeout function into this to give people some time to fill out the fb dialogue? thanks. If anyone has a better way to do this I'm all ears. This is for a business page and I cannot seem to add an app to get an app ID anymore so the API is pretty useless to me at this point. Also, if the url to be liked is a fb page, the callbacks don't seem to fire. Other code used: <html xmlns:fb="http://ogp.me/ns/fb#"> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script> <fb:like href="onlynonfburl.com" send="false" layout="button_count" width="450" show_faces="false" font="arial"></fb:like>

    Read the article

  • Renaming a DOMNode in PHP

    - by python
    <?xml version='1.0' encoding='UTF-8' standalone='no'?> <Document xmlns='urn:iso:std:iso:20022:tech:xsd:pain.001.001.02'> <books> <book> <qty>12</qty> <title>C++</title> </book> <book> <qty>21</qty> <title>PHP</title> </book> </books> <books> <book> <qty>25</qty> <title>Java</title> </book> <book> <qty>32</qty> <title>Python</title> </book> <book> <qty>22</qty> <title>History</title> </book> </books> </Document> How Can I Rename ? <Document xmlns='urn:iso:std:iso:20022:tech:xsd:pain.001.001.02'> TO <Document>

    Read the article

  • hide inputs value when input is hidden

    - by toingbou
    Hello, im using this function to hide some inputs from a form when a value selected in select tag. this is the function: function showEntry(obj,optionValue){ //hide all entry selections onchange document.getElementById("group1").style.display="none"; document.getElementById("group2").style.display="none"; if(obj.value=="group1") { document.getElementById('group1').style.display="inline"; } else if(obj.value=="group2") { document.getElementById('group2').style.display="inline"; } } and this is the form: <select class="textinput" name="function_title" onchange="showEntry(this,this.value);"> <option value=""> </option> <option value="group1" >group1</option> <option value="group2" >group2</option> </select> <span id="group1" style="display:none;"> <input class="textinput" type="text" id="input1" name="input1" value="100"/> <input class="textinput" type="text" id="input2" name="input2" value="50"/> </span> <span id="group2" style="display:none;"> <input class="textinput" type="text" id="input3" name="input3" value="60"/> <input class="textinput" type="text" id="input4" name="input4" value="45"/> </span> All i want is to hide the hidden inputs value when this group of inputs are hidden. Something like that: <input class="textinput" type="text" id="input3" name="input3" value="if(obj.value!="group2") { print(60); }"/> Is that right?

    Read the article

  • Get element id on hover (or mouseover)

    - by Peter C
    Still getting to grips with jQuery and I am pleased to have got as far as I have, especially help from the posts in this forum. However, now got to a working function that does what I want, that is to create a radio group that looks like a button. It pulls data via json and loops through creating the radio buttons. I want to get the id of the radio buttons generated so that I can then parse through to the next step of the app but I can't get it to work. function FillDiv(groups, side) { var cnt = 1; var newClass = ''; var newType = ''; if (side == '#ck-button-left') { newClass = 'leftClass'; newType = 'radio' } else { newClass = 'rightClass'; newType = 'checkbox' } $.each(groups, function (index, groups) { $(side) .append( $(document.createElement('label')).attr({ id: cnt + 'lbl' }) ); $('#' + cnt + 'lbl') .append( $(document.createElement('input')).attr({ id: groups.GroupCode, type: newType, name: 'testGroup', class: newClass }) ); $('#' + groups.GroupCode).after ( $(document.createElement('span')).text(groups.GroupName).attr('class', 'leftSpan') ); $('#' + cnt + 'lbl').after($(document.createElement('br'))); cnt = cnt + 1; }); } Looking through various searched, it should work with something like... $('#leftSpan').mouseover(function () { $('#lblOutput').html(this.id); }); or, as I suspect, it is something to do with the nesting of the label/input that I need to reference the parent or child. Any pointers would be appreciated.

    Read the article

  • Using Read-Only Fields in a C# WebBrowser

    - by TheDramaLlama
    I'm currently using a WebBrowser control in a C# WinForms application, and attempting to control some variability presented with this control. Basically, my users log in to a separate UI provided by my application, which then displays the WebBrowser control, navigates to a predetermined log-in URL, and then auto-fills the username and password fields on that page. However, in order to prevent unpredictable behavior in this WebBrowser control, I want to make these username and password text boxes read-only after they are auto-populated. Essentially, I want the user to see a browser page that has been filled out for them, and that cannot be edited. (This is so that any authentication errors can be handled by my application as opposed to the browser.) The code I'm currently using to populate the text fields and make them read only is as follows: webBrowser1.Document.GetElementById("username").InnerText = username; webBrowser1.Document.GetElementById("password").InnerText = password; webBrowser1.Document.GetElementById("username").Enabled = false; webBrowser1.Document.GetElementById("password").Enabled = false; Unfortunately, when I try to make the fields read-only, the authentication server acts like the password field was not filled out, and prompts the user to fill it out again after the "Submit" button is clicked. Is this expected behavior, and if so, what other methods can I try to prevent users from changing the credentials that the browser was auto-populated with?

    Read the article

  • Deleting unneeded rows from a table with 2 criteria

    - by stormbreaker
    Hello. I have a many-to-many relations table and I need to DELETE the unneeded rows. The lastviews table's structure is: | user (int) | document (int) | time (datetime) | This table logs the last users which viewed the document. (user, document) is unique. I show only the last 10 views of a document and until now I deleted the unneeded like this: DELETE FROM `lastviews` WHERE `document` = ? AND `user` NOT IN (SELECT * FROM (SELECT `user` FROM `lastviews` WHERE `document` = ? ORDER BY `time` DESC LIMIT 10) AS TAB) However, now I need to also show the last 5 documents a user has viewed. This means I can no longer delete rows using the previous query because it might delete information I need (say a user didn't view documents in 5 minutes and the rows are deleted) To sum up, I need to delete all the records that don't fit these 2 criterias: SELECT ... FROM `lastviews` WHERE `document` = ? ORDER BY `time` DESC LIMIT 10 and SELECT * FROM `lastviews` WHERE `user` = ? ORDER BY `time` DESC LIMIT 0, 5 I need the logic. Thanks in advance.

    Read the article

  • How to Get / Set Div and Table Width / Height

    - by Nasser Hajloo
    I have a Table (or a region) and want to set it's Width and Height value to another Div (or region). The second one is actually a Ajax Indicator modal which display a loading text when the page is asynchronously post back. here is the example <table id="MainTable"> <tr> <td> Content .... </td> </tr> </table> <div id="Progress"> Ajax Indocator </div> the following javascript didn't work document.getElementById("Progress").style.width = document.getElementById("MainTable").style.width; document.getElementById("Progress").style.height = document.getElementById("MainTable").style.height; It should work both on IE and FireFox. how to correct it. I checked some other solution in StackOverFlow but I couldn't fix it. I'mwaiting to hear from you.

    Read the article

  • Cake returned the time consumed in data lookup in JQuery Alert Box

    - by kwokwai
    Hi all, When I was doing some self-learning on JQuery Ajax in Cakephp, I found out some strange behaviour in the JQuery Alert Box. Here are a few lines of code of the JQuery Ajax I used: $(document).ready(function(){ $(document).change(function(){ var usr = $("#data\\[User\\]\\[name\\]").val(); $.post{"http://www.mywebsite.com/controllers/action/", usr, function(msg){alert(msg);} } }); }); The Alert box shows me a message returned from the Action: Helloworld <!--0.656s--> I am not sure why the number of time consumption was displayed in the Alert box, since it was not in my code as follows: function action($data=null){ $this->autoRender = false; $result2=$this->__avail($data); if($result2==1) {return "OK";} else {return "NOT";} } CakePHP rteurned some extra information in the Alert box. Later I altered a single line of code and tried out this instead, and the time consumption was not displayed on screen then: $(document).ready(function(){ $(document).change(function(){ var usr = $("#data\\[User\\]\\[name\\]").val(); $.post{"http://www.mywebsite.com/controllers/action/", usr, function(msg){$("#username").append('<span>'+msg+</span'>);} } }); });

    Read the article

  • [DOM/JS] display table in IE

    - by budzor
    I have code like that: var xPola = 10, //how many cols yPola = 10, //how many cols bokPola = 30, //size of cell body = document.getElementsByTagName('body')[0]; var tablica = document.createElement('table'); body.appendChild(tablica); for( var y = 0; y < yPola; y++ ) { var rzad = document.createElement('tr'); tablica.appendChild(rzad); for( var x = 0; x < xPola; x++ ) { var pole = document.createElement('td'); pole.setAttribute('width', bokPola); pole.setAttribute('height', bokPola); rzad.appendChild(pole); } }; it works fine in FF, Chrome & Opera (it displays 10x10 table with 30px width&height rows). In IE nothing happens. I check in firebug lite and it is in HTML section, inside BODY tag but i see nothing. Whats wrong?

    Read the article

  • Why can't I dynamically add rows to a HTML table using JavaScript in Internet Explorer?

    - by karlthorwald
    In Firefox it works, in my Internet Explorer 6 or 7 it doesn't: <html> <head> <script type="text/javascript"> function newLine() { var tdmod = document.createElement('td'); tdmod.appendChild(document.createTextNode("dynamic")); var tr = document.createElement('tr'); tr.appendChild(tdmod); var tt = document.getElementById("t1"); tt.appendChild(tr); } </script> </head> <body> <a href="#" onclick="newLine()">newLine</a> <table id="t1" border="1"> <tr> <td> static </td> </tr> </table> </body> The user clicks on the link "newLine" and new rows should be added to the table. How to make this work also in IE? Edit: Thanks to the accepted answer I changed it like this and now it works: <table border="1"> <tbody id="t1"> <tr> <td> static </td> </tr> </tbody> </table>

    Read the article

  • javascript error handling

    - by pankaj
    I have a javascript function for checking errors which I am calling on OnClicentClick event of a button. Once it catch a error I want to stop execution of the click event. But in my case it always it always executes the onclick event. Following is my function: function DisplayError() { if (document.getElementById('<%=txtPassword.ClientID %>').value.length < 6 || document.getElementById('<%=txtPassword.ClientID %>').value.length > 12) { document.getElementById('<%=lblError.ClientID %>').innerText = "Password length must be between 6 to 12 characters"; return false; } var str = <%=PhoneNumber()%>; if(str.length <10) { alert('<%=phoneNum%>'.length); document.getElementById('<%=lblError.ClientID %>').innerText = "Phone Number not in correct format"; return false; } } button html code: <asp:Button runat="server" Text="Submit" ID="btnSubmit" ValidationGroup="submit" onclick="btnSubmit_Click" OnClientClick="DisplayError()"/> It should not execute the button click event once it satisfies any of the IF condition in the javascript function.

    Read the article

  • Binding Javascript Event Handlers to a an Ajax HTML Response?

    - by John
    Let's say I have the following HTML code <div id="outer"> <div id="inner">Hello World</div> </div> At the end of my HTML page, I use javascript to attach event handlers like so, document.getElementById('inner').onclick = function() {alert(this.innerHTML);} document.getElementById('outer').onclick = function() { /* An Ajax Call where the response, which will be a string of HTML content, then goes into document.getElementById('outer').innerHTML */ document.getElementById('inner').onclick = function() {alert(this.innerHTML);} } In the above code, I am expecting <div id="inner">Hello World 2</div> to come back which requires me to re-attach the onclick event handler. This makes sense because the new response coming back is just a string, and I have to tell the browser that after converting to DOM, i also need some event handlers So my question is, is there a better way to manage event handlers on AJAX response that contains HTML content? I could use inline javascript within the html response, but then it prevents me from achieving non-intrusive javascript. So is there a way to achieve non-intrusive javascript and an efficient way to "maintain" event handlers of ajax html responses?

    Read the article

  • Python "callable" attribute (pseudo-property)

    - by mgilson
    In python, I can alter the state of an instance by directly assigning to attributes, or by making method calls which alter the state of the attributes: foo.thing = 'baz' or: foo.thing('baz') Is there a nice way to create a class which would accept both of the above forms which scales to large numbers of attributes that behave this way? (Shortly, I'll show an example of an implementation that I don't particularly like.) If you're thinking that this is a stupid API, let me know, but perhaps a more concrete example is in order. Say I have a Document class. Document could have an attribute title. However, title may want to have some state as well (font,fontsize,justification,...), but the average user might be happy enough just setting the title to a string and being done with it ... One way to accomplish this would be to: class Title(object): def __init__(self,text,font='times',size=12): self.text = text self.font = font self.size = size def __call__(self,*text,**kwargs): if(text): self.text = text[0] for k,v in kwargs.items(): setattr(self,k,v) def __str__(self): return '<title font={font}, size={size}>{text}</title>'.format(text=self.text,size=self.size,font=self.font) class Document(object): _special_attr = set(['title']) def __setattr__(self,k,v): if k in self._special_attr and hasattr(self,k): getattr(self,k)(v) else: object.__setattr__(self,k,v) def __init__(self,text="",title=""): self.title = Title(title) self.text = text def __str__(self): return str(self.title)+'<body>'+self.text+'</body>' Now I can use this as follows: doc = Document() doc.title = "Hello World" print (str(doc)) doc.title("Goodbye World",font="Helvetica") print (str(doc)) This implementation seems a little messy though (with __special_attr). Maybe that's because this is a messed up API. I'm not sure. Is there a better way to do this? Or did I leave the beaten path a little too far on this one? I realize I could use @property for this as well, but that wouldn't scale well at all if I had more than just one attribute which is to behave this way -- I'd need to write a getter and setter for each, yuck.

    Read the article

  • How to return a variable from a javascript function into html body.

    - by anthr
    Hi there, I am still new to javascript, and I am trying to get a function to return a variable using html & javascript. Basically the function should just return whichever radio button that the user clicks on, although at the moment I don't see anything being returned at all. The function is here: <script type="text/javascript"> function GetSelectedItem() { var chosen = "" len = document.f1.r1.length for (i = 0; i <len; i++) { if (document.f1.r1[i].checked) { chosen = document.f1.r1[i].value } } } return chosen </script> And then in the html section I have these radio buttons, and my attempt to get the variable "chosen" output to the screen. <form name = f1><Input type = radio Name = r1 Value = "ON" onClick=GetSelectedItem()>On <Input type = radio Name = r1 Value = "OFF" onClick =GetSelectedItem()>Off</form> <script type ="text/javascript">document.write(chosen)</script> At the moment nothing seems to be getting returned from the function (although if I output the variable 'chosen' inside the function then it is working correctly. Thanks in advance!

    Read the article

  • How to store a captured image into MySQL database using JavaScript

    - by R J.
    I am capturing image using canvas and i want to store a captured image in MySQL Database using Javascript. This is my code: <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, maximum-scale=1.0"> <style> body {width: 100%;} canvas {display: none;} </style> <title>Instant Camera - Remote</title> <script> var video, canvas, msg; var load = function () { video = document.getElementById('video'); canvas = document.getElementById('canvas'); msg = document.getElementById('error'); if( navigator.getUserMedia ) { video.onclick = function () { var context = canvas.getContext("2d"); context.drawImage(video, 0, 0, 240, 320); var image1 = canvas.toDataURL("image/png"); document.write('<img src="' + image1 + '" />'); }; } else { msg.innerHTML = "Native web camera not supported :("; } }; window.addEventListener('DOMContentLoaded', load, false); </script> </head> <body> <video id="video" width="240" height="320" autoplay> </video> <p id="error">Click on the video to send a snapshot to the receiving screen</p> <canvas id="canvas" width="240" height="320"> </canvas> </body> </html>

    Read the article

  • Opera bug with JS autoselecting text (if more than 1 div)

    - by E L
    Here is HTML code. It supposed to select all text in "Container" div <B onclick="SelectText(document.getElementById('Container'));">select all text</B> <Div id="Container"> <Div>123456</Div> <Div>123456</Div> <Div onclick="SelectText();">123456</Div> </Div> here is JS code of the SelectText() function function SelectText(target){ if(target==null){ var e = window.event || e; if (!e) var e = window.event; var target=e.target || e.srcElement; } var rng, sel; if ( document.createRange ) { rng = document.createRange(); rng.selectNode( target ); sel = window.getSelection(); sel.removeAllRanges(); sel.addRange( rng ); } else { var rng = document.body.createTextRange(); rng.moveToElementText( target ); rng.select(); } } Problem is that in Opera 12.02 when "select all text" is clicked, all text seems like selected, but it's not selected (I can't rightclick it and copy). (terrific, but IE works fine with it) Why not in Opera?!!! And what can I do to make Opera 12.02 believe that all text in "Container" is selected?

    Read the article

  • Drawing straight lines in JavaScript

    - by Shawn31313
    I'm just trying to draw a line with JavaScript. I would like it to be like this: http://deepliquid.com/projects/blog/arrows2.html My version: http://jsfiddle.net/shawn31313/qsWML/5/show Doesn't work too well and I don't know how to get it too work. It must be an issue in my JavaScript. This my code: $(document).ready(function() { var dragStatus = 2, getPos, giveRandomID; $(document).mousedown(function(event) { dragStatus = 0; getPos = { top: event.clientY, left: event.clientX }; giveRandomID = Math.floor(Math.random() * 99999); }); $(document).mousemove(function() { var line = $('#line' + giveRandomID); if (dragStatus == 0) { $('body').append("<div id='line" + giveRandomID + "' style='position:absolute;top:" + getPos.top + "px;left:" + getPos.left + "px;background:black;width:2px;height:5px'></div>"); dragStatus = 1; } if (dragStatus == 1) { if (event.clientX > getPos.left) { line.css({ left: getPos.left, width: event.clientX - getPos.left }); } else { line.css({ left: event.clientX, width: getPos.left - event.clientX }); } if (event.clientY > getPos.top) { line.css({ top: getPos.top - Math.abs((event.clientY - getPos.top) * 2), '-webkit-transform': 'rotate(' + (event.clientY - getPos.top) + 'deg)' }); } else { line.css({ top: getPos.top + Math.abs((getPos.top - event.clientY) * 2), '-webkit-transform': 'rotate(' + (getPos.top - event.clientY) + 'deg)' }); } //for DEG "-" Top-Math.abs(DEG*2) for Deg "+" Top+(DEG*2) } }); $(document).mouseup(function() { dragStatus = 2; }); });? Thanks for any help fixing this. Mainly an issue with the math, just don't know how I can fix this.

    Read the article

  • Download Canvas Image Png Chome/Safari

    - by user2639176
    Works in Firefox, and won't work in Safari, or Chrome. function loadimage() { var canvas = document.getElementById("canvas"); if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); xmlhttp2=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp2=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { rasterizeHTML.drawHTML(xmlhttp.responseText, canvas); var t=setTimeout(function(){copy()},3000) } } xmlhttp.open("GET","/sm/<?=$sm[0];?>",true); xmlhttp.send(); } function copy() { var canvas = document.getElementById("canvas"); var img = canvas.toDataURL("image/png"); document.getElementById('dl').href = img; document.getElementById('dl').innerHTML = "Download"; } Now I didn't write this, so I don't know too much javascript. But the script works in Firefox. In Chrome, getting: Uncaught Security Error: An attempt was made to break through the security policy of the user-agent. For toDataURL("image/png")

    Read the article

  • Tracking download of non-html (like pdf) downloads with jQuery and Google Analytics

    - by developerit
    Hi folks, it’s been quite calm at Developer IT’s this summer since we were all involved in other projects, but we are slowly comming back. In this post, we will present a simple way of tracking files download with Google Analytics with the help of jQuery. We work for a client that offers a lot of pdf files to download on their web site and wanted to know which one are the most popular. They use Google Analytics for a long time now and we did not want to have a second interface in order to present those stats to our client. So usign IIS logs was not a idea to consider. Since Google already offers us a splendid web interface and a powerful API, we deceided to hook up simple javascript code into the jQuery click event to notify Analytics that a pdf has been requested. (function ($) { function trackLink(e) { var url = $(this).attr('href'); //alert(url); // for debug purpose // old page tracker code pageTracker._trackPageview(url); // you can use the new one too _gaq.push(["_trackPageview",url]); //always return true, in order for the browser to continue its job return true; } // When DOM ready $(function () { // hook up the click event $('.pdf-links a').click(trackLink); }); })(jQuery); You can be more presice or even be sure not to miss one click by changing the selector which hooks up the click event. I have been usign this code to track AJAX requests and it works flawlessly.

    Read the article

  • Replacing jQuery.live() with jQuery.on()

    - by Rick Strahl
    jQuery 1.9 and 1.10 have introduced a host of changes, but for the most part these changes are mostly transparent to existing application usage of jQuery. After spending some time last week with a few of my projects and going through them with a specific eye for jQuery failures I found that for the most part there wasn't a big issue. The vast majority of code continues to run just fine with either 1.9 or 1.10 (which are supposed to be in sync but with 1.10 removing support for legacy Internet Explorer pre-9.0 versions). However, one particular change in the new versions has caused me quite a bit of update trouble, is the removal of the jQuery.live() function. This is my own fault I suppose - .live() has been deprecated for a while, but with 1.9 and later it was finally removed altogether from jQuery. In the past I had quite a bit of jQuery code that used .live() and it's one of the things that's holding back my upgrade process, although I'm slowly cleaning up my code and switching to the .on() function as the replacement. jQuery.live() jQuery.live() was introduced a long time ago to simplify handling events on matched elements that exist currently on the document and those that are are added in the future and also match the selector. jQuery uses event bubbling, special event binding, plus some magic using meta data attached to a parent level element to check and see if the original target event element matches the selected selected elements (for more info see Elijah Manor's comment below). An Example Assume a list of items like the following in HTML for example and further assume that the items in this list can be appended to at a later point. In this app there's a smallish initial list that loads to start, and as the user scrolls towards the end of the initial small list more items are loaded dynamically and added to the list.<div id="PostItemContainer" class="scrollbox"> <div class="postitem" data-id="4z6qhomm"> <div class="post-icon"></div> <div class="postitemheader"><a href="show/4z6qhomm" target="Content">1999 Buick Century For Sale!</a></div> <div class="postitemprice rightalign">$ 3,500 O.B.O.</div> <div class="smalltext leftalign">Jun. 07 @ 1:06am</div> <div class="post-byline">- Vehicles - Automobiles</div> </div> <div class="postitem" data-id="2jtvuu17"> <div class="postitemheader"><a href="show/2jtvuu17" target="Content">Toyota VAN 1987</a></div> <div class="postitemprice rightalign">$950</div> <div class="smalltext leftalign">Jun. 07 @ 12:29am</div> <div class="post-byline">- Vehicles - Automobiles</div> </div> … </div> With the jQuery.live() function you could easily select elements and hook up a click handler like this:$(".postitem").live("click", function() {...}); Simple and perfectly readable. The behavior of the .live handler generally was the same as the corresponding simple event handlers like .click(), except that you have to explicitly name the event instead of using one of the methods. Re-writing with jQuery.on() With .live() removed in 1.9 and later we have to re-write .live() code above with an alternative. The jQuery documentation points you at the .on() or .delegate() functions to update your code. jQuery.on() is a more generic event handler function, and it's what jQuery uses internally to map the high level event functions like .click(),.change() etc. that jQuery exposes. Using jQuery.on() however is not a one to one replacement of the .live() function. While .on() can handle events directly and use the same syntax as .live() did, you'll find if you simply switch out .live() with .on() that events on not-yet existing elements will not fire. IOW, the key feature of .live() is not working. You can use .on() to get the desired effect however, but you have to change the syntax to explicitly handle the event you're interested in on the container and then provide a filter selector to specify which elements you are actually interested in for handling the event for. Sounds more complicated than it is and it's easier to see with an example. For the list above hooking .postitem clicks, using jQuery.on() looks like this:$("#PostItemContainer").on("click", ".postitem", function() {...}); You specify a container that can handle the .click event and then provide a filter selector to find the child elements that trigger the  the actual event. So here #PostItemContainer contains many .postitems, whose click events I want to handle. Any container will do including document, but I tend to use the container closest to the elements I actually want to handle the events on to minimize the event bubbling that occurs to capture the event. With this code I get the same behavior as with .live() and now as new .postitem elements are added the click events are always available. Sweet. Here's the full event signature for the .on() function: .on( events [, selector ] [, data ], handler(eventObject) ) Note that the selector is optional - if you omit it you essentially create a simple event handler that handles the event directly on the selected object. The filter/child selector required if you want life-like - uh, .live() like behavior to happen. While it's a bit more verbose than what .live() did, .on() provides the same functionality by being more explicit on what your parent container for trapping events is. .on() is good Practice even for ordinary static Element Lists As a side note, it's a good practice to use jQuery.on() or jQuery.delegate() for events in most cases anyway, using this 'container event trapping' syntax. That's because rather than requiring lots of event handlers on each of the child elements (.postitem in the sample above), there's just one event handler on the container, and only when clicked does jQuery drill down to find the matching filter element and tries to match it to the originating element. In the early days of jQuery I used manually build handlers that did this and manually drilled from the event object into the originalTarget to determine if it's a matching element. With later versions of jQuery the various event functions in jQuery essentially provide this functionality out of the box with functions like .on() and .delegate(). All of this is nothing new, but I thought I'd write this up because I have on a few occasions forgotten what exactly was needed to replace the many .live() function calls that litter my code - especially older code. This will be a nice reminder next time I have a memory blank on this topic. And maybe along the way I've helped one or two of you as well to clean up your .live() code…© Rick Strahl, West Wind Technologies, 2005-2013Posted in jQuery   Tweet !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();

    Read the article

  • Run WordPress & Other Web Apps with Windows Web Platform

    - by Matthew Guay
    Would you like to run WordPress or other web apps on your PC so you can easily test and design websites?  Here we’ll look at how you can get the latest web apps on your computer in only a few quick steps. Many web apps today, such as WordPress, MediaWiki, and more, are open source and can be run for free from any computer with even a simple local web server.  They are often very difficult to install on your computer, since they require a number of dependencies such as PHP and MySQL.  Microsoft has worked to make this easier, releasing the Windows Web Platform Installer.  This lets you install many popular web apps and free tools in Windows with only a few clicks. Here we’re going to look at how to install WordPress and the free Visual Web Developer 2010 Express to edit web code with the Web Platform Installer.  But, if you’d rather install a different web app or tool, feel free to choose those as the installations are generally similar. Getting Started Head over to Microsoft’s Web development site and download the Web Platform Installer (link below).  This will download very quick, as it is just a small loader.  When you run this loader, it will download the Web Platform Installer files.  The Web Platform Installer works on XP, Vista, and Windows 7, as well as the related versions of Windows Server. After a couple moments, the Web Platform Installer will open and load information about the latest web offerings.    Now you can choose what you want to install.  You can quickly select the recommended products for several categories such as Web Server, Database, and more. Alternately, click Customize under the category and select exactly what you want to install.  Note that items already installed on your computer will be grayed out. We wanted to install Visual Web Developer 2010 Express, so select Customize under Tools, and select Visual Web Developer 2010 Express. Or, for more preset choices, select Options on the bottom of the window. You can choose to add Multimedia, Developer, and Enterprise tools to the lists, or add a new preset list from a feed. Choose Specific Web apps to Install We wanted to install WordPress, so instead of choosing a preset, select the Web Applications tab on the left.  Now you can choose from a variety of apps based on category, or you can view them all together in an A to Z, Most Popular, or Highest Rating list. Click the checkbox beside the app you want to install to select it, or click the “i” for more information. Here’s the More Information pane for WordPress.  If you’re ready to install it, click the checkbox. Now you can go back and add more web apps or tools to the install list if you like.  The Web Platform Installer will automatically find and select prerequisite apps such as MySQL, so you won’t need to worry about finding them. Once you’ve selected everything you want to install, click the Install button on the bottom of the window. The Web Platform Installer will now show you everything that’s selected, including components that it automatically selected.  Notice we only chose to install WordPress and Visual Web Developer 2010 Express, but it also has selected MySQL and PHP automatically.  Click I Accept to proceed. Enter an administrator password for MySQL before the setup begins. Now the Web Platform Installer will take over, automatically downloading, installing, and configuring all of your web apps.  It will also activate optional Windows components that may be needed on your computer.  This may take several minutes, depending on the components you selected and your internet speed.   Setting up Your Test Site Once the installation is finished, you’ll be asked to enter some information about your site.  You can simply accept the defaults or enter your own choices, and then click Continue. Now you’ll need to enter some information for your web apps.  When installing WordPress, you’ll need to choose a database and enter administrative usernames and passwords.  You may also be asked to enter extra information for additional security, but for a local-only test site this isn’t necessary.  Click Continue when you’re finished. You’ll need to wait a few more moments as it complete the setup of your web apps.  The good thing is, once it’s finished, they’ll be ready to go with only minimal configuration. And you’re finished!  The installer will let you know everything it installed, and if there were any problems.  In our test, Visual Web Developer 2010 Express failed to install successfully.  Often the problems may be with the download, so click Finish and then reselect the apps that didn’t install and run the installer again. Now you’re ready to run WordPress from your PC.  Click the Launch WordPress link or enter http://localhost:80/wordpress in your browser to get started. You’ll only have a little more setup to do on WordPress to get it running.  Once you’ve opened your WordPress page in your browser, enter a name for your blog and your email address, and click Install WordPress.   After a few seconds, you should see a Success! page with your username and a temporary password.  Copy the password, and then click Log In. Enter admin as the Username and paste the random generated password, and click Log In. WordPress will remind you to change the default password.  Click the Yes, Take me to my profile page link to do this. Enter something easier for you to remember, and click Update Profile. Now you’re ready to enjoy your new WordPress install on Windows.  You can add plugins and themes, and everything else you’d do with a normal WordPress site.  Here’s the dashboard running from localhost. And here’s the default blog running. Setting up Visual Web Developer 2010 Express As mentioned before, Visual Web Developer 2010 Express didn’t install correctly on our first try, but the second time it installed seamlessly.  Once it’s installed, launch it from your start menu as normal.  It may take a few minutes to load on the first run as it is finishing up setup. You may notice that the splash screen displayed while the program is loading says For Evaluation Purposes Only.  This is because you still need to register the program. You have 30 days to register the program, but let’s go ahead and do it to get this step out of the way.  Click Help in the menu bar, and select Register Product. Click Obtain a registration key online in the popup window. You’ll need to sign in with your Windows Live ID, and then fill out a quick form. When you’re done, copy the registration key displayed and paste it into the registration dialog in Visual Web Developer.   Now you’ve got a registered, free web development program with full standards compliance and IntelliSense to help you work smarter and faster.  And it works great with your local web apps, so you can create, tweak, and then deploy, all from your desktop with this simple installer! Install More Apps You can always run the Web Platform Installer again in the future and add more apps if you’d like.  The install adds a link to the Installer in the Start menu; just run it and repeat the steps above with your new selections. Also, from the installer, you can cleanup the setup files downloaded during the installation if you want.  Click the Options link in the bottom of the window, and then scroll down and select Delete installer cache folder. Uninstalling the apps is not as easy, unfortunately.  If you wish to uninstall the Web Platform Installer and everything you installed with it, you’ll need to uninstall each item individually.  One easy way to see what was all installed together is to sort the entries in Uninstall Programs by date.  In our case, we also installed some other applications on the same day, but it’s easier to see what was installed together. Or if you are not a fan of using Programs and Features to uninstall them, try out a program like Revo Uninstaller Pro. Conclusion Whether you’re a full-time web developer or just enjoy testing out the latest web apps, the Web Platform Installer makes it quick and easy to get your computer loaded up with the latest bits.  In fact, it’s easier to install these tools with all their dependencies than it is to install many standard boxed programs. If you’d like to take your web server anywhere you go and not have it confined to your desktop, then check out our article on how to Turn Your Flashdrive into a Portable Webserver. Link Download the Microsoft Web Platform Installer Similar Articles Productive Geek Tips Linux QuickTip: Downloading and Un-tarring in One StepQuick Tip: Set a Future Date for a Post in WordPressHow-To Geek SoftwareAdd Social Bookmarking (Digg This!) Links to your Wordpress BlogHow-To Geek Software: WordPress Comment Moderation Notifier TouchFreeze Alternative in AutoHotkey The Icy Undertow Desktop Windows Home Server – Backup to LAN The Clear & Clean Desktop Use This Bookmarklet to Easily Get Albums Use AutoHotkey to Assign a Hotkey to a Specific Window Latest Software Reviews Tinyhacker Random Tips Xobni Plus for Outlook All My Movies 5.9 CloudBerry Online Backup 1.5 for Windows Home Server Snagit 10 Windows Media Player Glass Icons (icons we like) How to Forecast Weather, without Gadgets Outlook Tools, one stop tweaking for any Outlook version Zoofs, find the most popular tweeted YouTube videos Video preview of new Windows Live Essentials 21 Cursor Packs for XP, Vista & 7

    Read the article

  • Little PM side post...

    - by edgaralgernon
    When adding new team memebers... off set the ramp up time by 1) having pre built machines ready and and easy method of getting the lastest tools, code base etc. I'm fortunate enough to be at a client that has a machine ready built and loaded when the dev arrives, all they have to do is grab the code. 2) have tasks broken down so that dependencies are as minimal as possible. In other words, to over come the mythical man month issue (as recently mentioned on slashdot) make sure the tasks you hand out have few dependencies on each other. That way the new dev is able to be productive fairly quickly. Here's our historical lead time... the bump in Jan is due to added work, by 2/18 we had added 4 new people over the last two weeks. And amazing the time starts coming down: Here's our averag work time: again time ramps up as we are adding more tasks, but then starts inching back down through out Feb and March. It's not that we beat the Mythical Man Month, and in fact I still believe the book and idea are highly relevant. But if you can break the tasks down and reduce the dependencies between the task then you can mitigate the effect. The tool used in this case is from AgileZen.com and some of the wild swings are due to inexperience with the system initially... but our average times as measured by the tool are matching real life. Also the tool appearst to measure in 24 hour days and 7 day weeks. so it isn't as bad as it looks. :-)

    Read the article

  • Installation procedure RAC One Node

    - by rene.kundersma
    Okay, In order to test RAC One Node, on my Oracle VM Laptop, I just: - installed Oracle VM 2.2 - Created two OEL 5.3 images The two images are fully prepared for Oracle 11gr2 Grid Infrastructure and 11gr2 RAC including four shared disks for ASM and private nics. After installation of the Oracle 11gr2 Grid Infrastructure and a "software only installation" of 11gr2 RAC, I installed patch 9004119 as you can see with the opatch lsinv output: This patch has the scripts required to administer RAC One Node, you will see them later. At the moment we have them available for Linux and Solaris. After installation of the patch, I created a RAC database with an instance on one node. Please note that the "Global Database Name" has to be the same as the SID prefix and should be less then or equal to 8 characters: When the database creation is done, first I create a service. This is because RAC One Node needs to be "initialized" each time you add a service: The service configuration details are: After creating the service, a script called raconeinit needs to run from $RDBMS_HOME/bin. This is a script supplied by the patch. I can imagine the next major patch set of 11gr2 has this scripts available by default. The script will configure the database to run on other nodes: After initialization, when you would run raconeinit again, you would see: So, now the configuration is ready and we are ready to run 'Omotion' and move the service around from one node to the other (yes, vm competitor: this is service is available during the migration, nice right ?) . Omotion is started by running Omotion. With Omotion -v you get verbose output: So, during the migration you will see the two instance active: And, after the migration, there is only one instance left on the new node:

    Read the article

  • "Oracle Fusion Is Worth Your Consideration," States Mark Smith of Ventana Research

    - by Richard Lefebvre
    After attending OOW 2012, Mark Smith of Ventana Research has written a great blog post on Oct 4th, 2012 titled "Oracle Fusion for CRM and HCM Ready with a Mobile Tap." In this blog post, Mark goes on to say: "It was a great opportunity to get close to the Oracle Fusion Applications, which the company presented as proven and ready, with customers using them on-premises and in private and public cloud computing usage methods. In keynotes from executives Larry Ellison, Mark Hurd and Thomas Kurian and application-focused sessions with executives Steve Miranda and Chris Leone, Oracle repeated the message that Fusion Applications are not just for cloud computing and web services but are also accessible through mobile technology called Oracle Fusion Tap that operates natively on the Apple iPad. The company left no confusion about its applications' readiness for cloud and mobile computing, and provided insight into future advancements." Mark also states: " After two days of Oracle and customer sessions, along with a visit to the demonstration stands in the exposition area, it was clear that Oracle has made an important change in its approach to the market and its executive-level commitment to Fusion Applications. I saw more dialogue with partners to complement its applications, and many announcements, including Oracle's on partners in Fusion CRM, who were also visible during presentations and demonstrations." In closing, Mark makes the following proclamation: "Oracle Fusion is worth your consideration whether you are considering a move to cloud computing or still run applications on-premises or use a hybrid approach which provides more choices to customers than just a cloud computing only approach. We are now in a renaissance of business driving what it needs from business applications, and vendors that convince business they can be trusted will be at the center of a new world of cloud, mobile and social computing." This post is really worth a read. You can find the entire post here.

    Read the article

< Previous Page | 118 119 120 121 122 123 124 125 126 127 128 129  | Next Page >