Search Results

Search found 28881 results on 1156 pages for 'javascript is future'.

Page 420/1156 | < Previous Page | 416 417 418 419 420 421 422 423 424 425 426 427  | Next Page >

  • jquery .get/.post not working on ie 7 or 8, works fine in ff

    - by Samutz
    I have basically this on a page: <script type="text/javascript"> function refresh_context() { $("#ajax-context").html("Searching..."); $.get("/ajax/ldap_search.php", {cn: $("#username").val()}, function(xml) { $("#ajax-context").html($("display", xml).text()); $("#context").val($("context", xml).text()); }, 'xml'); } $(document).ready(function() { $("#username").blur(refresh_context); }); </script> <input type="text" name="username" id="username" maxlength="255" value="" /> <input type="hidden" name="context" id="context" value=""/> <div id="ajax-context"></div> What it should do (and does fine on Firefox) is when you type a username in to the #username field, it will run /ajax/ldap_search.php?cn=$username, which searches our company's ldap for the username and returns it's raw context and a formatted version of the context like this: <result> <display>Staff -&gt; Accounting -&gt; John Smith</display> <context>cn=jsmith,ou=Accounting,ou=Staff,ou=Users,o=MyOrg</context> </result> The formatted version (display) goes to the div #ajax-context and goes to the hidden input #context. (Also, the - are actually - "& g t ;" (without spaces)). However, on IE the div stays stuck on "Searching..." and the hidden input value stays blank. I've tried both .get and .post and neither work. I'm sure it's failing on the .get because if I try this, I don't even get the alert: $.get("/ajax/ldap_search.php", {cn: $("#username").val()}, function() { alert("Check"); }); Also, IE doesn't give me any script errors. Edit: Added "$(document).ready(function() {", the .blur was already in it in my code, but I forgot to include that in my post. Edit 2: The request is being sent and apache2 is receiving it: 10.135.128.96 - - [01/May/2009:10:04:27 -0500] "GET /ajax/ldap_search.php?cn=i_typed_this_in_IE HTTP/1.1" 200 69

    Read the article

  • Using a large list of terms, search through page text and replace words with links

    - by dunc
    A while ago I posted this question asking if it's possible to convert text to HTML links if they match a list of terms from my database. I have a fairly huge list of terms - around 6000. The accepted answer on that question was superb, but having never used XPath, I was at a loss when problems started occurring. At one point, after fiddling with code, I somehow managed to add over 40,000 random characters to our database - the majority of which required manual removal. Since then I've lost faith in that idea and the more simple PHP solutions simply weren't efficient enough to deal with the amount of data and the quantity of terms. My next attempt at a solution is to write a JS script which, once the page has loaded, retrieves the terms and matches them against the text on a page. This answer has an idea which I'd like to attempt. I would use AJAX to retrieve the terms from the database, to build an object such as this: var words = [ { word: 'Something', link: 'http://www.something.com' }, { word: 'Something Else', link: 'http://www.something.com/else' } ]; When the object has been built, I'd use this kind of code: //for each array element $.each(words, function() { //store it ("this" is gonna become the dom element in the next function) var search = this; $('.message').each( function() { //if it's exactly the same if ($(this).text() === search.word) { //do your magic tricks $(this).html('<a href="' + search.link + '">' + search.link + '</a>'); } } ); } ); Now, at first sight, there is a major issue here: with 6,000 terms, will this code be in any way efficient enough to do what I'm trying to do?. One option would possibly be to perform some of the overhead within the PHP script that the AJAX communicates with. For instance, I could send the ID of the post and then the PHP script could use SQL statements to retrieve all of the information from the post and match it against all 6,000 terms.. then the return call to the JavaScript could simply be the matching terms, which would significantly reduce the number of matches the above jQuery would make (around 50 at most). I have no problem with the script taking a few seconds to "load" on the user's browser, as long as it isn't impacting their CPU usage or anything like that. So, two questions in one: Can I make this work? What steps can I take to make it as efficient as possible? Thanks in advance,

    Read the article

  • How do I create links in the cells of a PHP generated table?

    - by typoknig
    I have a table generated from some PHP code that lists a SMALL amount of important information for employees. I want to make it so each row, or at least one element in each row can be clicked on so the user will be redirected to ALL of the information (pulled from MySQL database) related to the employee who was clicked on. I am not sure how would be the best way to go about this, but I am open to suggestions. I would like to stick to PHP and/or JavaScript. Below is the code for my table: <table> <tr> <td id="content_heading" width="25px">ID</td> <td id="content_heading" width="150px">Last Name</td> <td id="content_heading" width="150px">First Name</td> <td id="content_heading" width="75px">SSN</td> </tr> <?php $user = 'user'; $pass = 'pass'; $server = 'localhost'; $link = mysql_connect($server, $user, $pass); if (!$link){ die('Could not connect to database!' . mysql_error()); } mysql_select_db('mydb', $link); $query = "SELECT * FROM employees"; $result = mysql_query($query); mysql_close($link); $num = mysql_num_rows($result); for ($i = 0; $i < $num; $i++){ $row = mysql_fetch_array($result); $class = (($i % 2) == 0) ? "table_odd_row" : "table_even_row"; echo "<tr class=".$class.">"; echo "<td>".$row[id]."</td>"; echo "<td>".$row[l_name]."</td>"; echo "<td>".$row[f_name]."</td>"; echo "<td>".$row[ssn]."</td>"; echo "</tr>"; } ?> </table>

    Read the article

  • No image displayed in Fancybox

    - by seansean11
    I am having trouble getting fancybox to display its corresponding images on a website that I'm building http://www.nomadicdrift.com/test/kaniwa#events . It's a custom one page portfolio theme that I set up on the WordPress platform. If you follow the link to the events section you will see 1 figure item in a gallery like position. I have this image set up to work as a fancybox gallery, but when you click on it, it opens up the fancybox interface but does not place a image in the frame, even though it should. So this is the problem...the images do not show up in fancybox and instead I see just the frame. Here is the html that I'm displaying: <figure> <a class="fancybox" data-fancybox-type="Fashion Show de Paris, France" href="http://www.nomadicdrift.com/test/kaniwa/wp-content/uploads/2012/07/NM2.jpg"> <img class="attachment-evento wp-post-image" width="231" height="191" title="NM" alt="NM" src="http://www.nomadicdrift.com/test/kaniwa/wp-content/uploads/2012/07/NM2-231x191.jpg"> </a> <figcaption> <a class="fancybox" data-fancybox-type="Fashion Show de Paris, France" href="http://www.nomadicdrift.com/test/kaniwa/wp-content/uploads/2012/07/CEDESAN.jpg"> </a> <h4>Fashion Show de Paris, France</h4> </figcaption> </figure> I'm not going to bore you with the PHP that I used to get that output because I think the problem lies elsewhere. ***I have tried to set up a simple standard fancybox gallery on the site also, but it gives me thes same problem, leading me to believe that the problem is deeper than the html markup. I have also successfully used this same markup for a one thumbnail fancybox gallery on another site. I thought maybe it was due to some conflict in the .js files I'm using. I tried uninstalling all of my plugins/addons (which aren't too many) one by one and still had the same result. I have all of my personal javascript in the functions.js file, which is where I call the fancybox plugin using the standard $("a.fancybox").fancybox();. I have installed this plugin before on other sites and have searched extensively for an answer, so any help is greatly appreciated. Thanks, Sean

    Read the article

  • Is it possible to use CSS to align these divs/spans in a table-like manner? (While still retaining continuity)

    - by Justin L.
    I have <div class='line'> <div class='chord_line'> <span class='chord_block'></span> <span class='chord_block'>E</span> <span class='chord_block'>B</span> <span class='chord_block'>C#m</span> <span class='chord_block'>A</span> </div> <div class='lyric_line'> <span class='lyric_block'></span> <span class='lyric_block'>Just a</span> <span class='lyric_block'>small-town girl</span> <span class='lyric_block'>living in a</span> <span class='lyric_block'>lonely world</span> </div> </div> (Excuse me for not being too familiar with proper css conventions for when to use div/spans) I want to be able to display them so that each chord_block span and lyric_block span is aligned vertically, as if they were left-aligned and on the same row of a table. For example: E B C#m A Just a small-town girl living in a lonely world (There will often be cases where an empty chord block is matched up to non-empty lyric block, and vice-versa.) I'm completely new to using CSS to align things, and have had no real understanding/experience of CSS aside from changing background colors and link styles. Is this possible in CSS? If not, how could the div/class nesting structure be revised to make this possible? I could change the spans to divs if necessary. Some things I cannot use: I can't change the structure to group things by a chord_and_lyric_block div (and have their width stretch to the length of the lyric, and stack them horizontally), because I couldn't really copy/select the lyrical lines continuously in their entirety, which is extremely critical. I'm trying to avoid a table-like solution, because this data is not tabular at all. The chord line and the lyric line are meant to be read as one continuous line, not a set of cells. Also, apart from the design philosophy reasons, I think it might have the same problems as the previous thing bullet point. If this is possible, what div/span attributes should I be using? Can you provide sample css? If this is not possible, can it be done with javascript? EDIT: I'm sorry I wasn't clear at the start, but I would like a solution that allows both the chord line and the lyric line to be "selectable" and continuous.

    Read the article

  • jquery position changing with .css() behaving strange

    - by 11684
    I tried to make a moving img, and it works partially. If I press the right, up or down button, it moves right, up or down. But, if I press the left button, it jumps very fast very far to the right, and then back to the left and doesn't stop moving (I believe. I said it was fast). JSFiddle; Javascript: $(document).ready(function() { var up = down = left = right = false; var top = 100, left = 500; $("body").on("keydown", function(e) { if(e.keyCode == 39) {e.preventDefault(); if (right == false) right = setInterval(moveRight, 80);} else if(e.keyCode == 37) {e.preventDefault(); if (left == false) left = setInterval(moveLeft, 80);} else if(e.keyCode == 38) {e.preventDefault(); if (up == false) up = setInterval(moveUp, 80);} else if(e.keyCode == 40) {e.preventDefault(); if (down == false) down = setInterval(moveDown, 80);} }); $("body").on("keyup", function(e) { if(e.keyCode == 39) {clearInterval(right); right = false;} else if(e.keyCode == 37) {clearInterval(left); left = false;} else if(e.keyCode == 38) {clearInterval(up); up = false;} else if(e.keyCode == 40) {clearInterval(down); down = false;} }); function moveUp() { top -= 2; $("#player").css("top", top + "px"); } function moveDown() { top += 2; $("#player").css("top", top + "px"); } function moveLeft() { left -= 2; $("#player").css("left", left + "px"); } function moveRight() { left += 2; $("#player").css("left", left + "px"); } }); This is probably not the best way to do this, I'm open for better suggestions. Thanks for reading!

    Read the article

  • Create unique links for indvidual elements of a PHP generated table

    - by typoknig
    I have a table generated from some PHP code that lists a SMALL amount of important information for employees. I want to make it so each row, or at least one element in each row can be clicked on so the user will be redirected to ALL of the information (pulled from MySQL database) related to the employee who was clicked on. I am not sure how would be the best way to go about this, but I am open to suggestions. I would like to stick to PHP and/or JavaScript. Below is the code for my table: <table> <tr> <td id="content_heading" width="25px">ID</td> <td id="content_heading" width="150px">Last Name</td> <td id="content_heading" width="150px">First Name</td> <td id="content_heading" width="75px">SSN</td> </tr> <?php $user = 'user'; $pass = 'pass'; $server = 'localhost'; $link = mysql_connect($server, $user, $pass); if (!$link){ die('Could not connect to database!' . mysql_error()); } mysql_select_db('mydb', $link); $query = "SELECT * FROM employees"; $result = mysql_query($query); mysql_close($link); $num = mysql_num_rows($result); for ($i = 0; $i < $num; $i++){ $row = mysql_fetch_array($result); $class = (($i % 2) == 0) ? "table_odd_row" : "table_even_row"; echo "<tr class=".$class.">"; echo "<td>".$row[id]."</td>"; echo "<td>".$row[l_name]."</td>"; echo "<td>".$row[f_name]."</td>"; echo "<td>".$row[ssn]."</td>"; echo "</tr>"; } ?> </table>

    Read the article

  • Jquery accordion, next and previous wizard, how to get previous and next sections?

    - by Wbdvlpr
    Hi I have a Jquery accordion which works fine. Sections get expanded/collapsed when clicked on respective headers. But I want to add the functionality so that when I click on "next" button it opens up the next section and clicking "Previous" button takes me back to previous section. This has been done on this page http://jquery.bassistance.de/accordion/demo/?p=1.1.2 (last example) but not sure how do I implement the same in my case. Any suggestions please. Thanks UPDATE: How do I get previous or next section of the accordion? <script type="text/javascript"> $("#accordion").accordion({ header: "h3.header" , autoHeight: false , collapsible: true }); </script> <div id="accordion"> <h3 class="header">Section 1</h3> <div> content 1 .. content 1 .. content 1 .. content 1 .. <input class="next" type="button" value="next"/> </div> <h3 class="header">Section 2</h3> <div> content 2 .. content 2 .. content 2 .. content 2 .. <input class="previous" type="button" value="previous"/> <input class="next" type="button" value="next"/> </div> <h3 class="header">Section 3</h3> <div> content 3 .. content 3 .. content 3 .. content 3 .. <input class="previous" type="button" value="previous"/> </div> </div>

    Read the article

  • Slideshare , API feed for javascript , jquery ...

    - by Alexander Corotchi
    Hi everybody, Can you help me with some information, to make it faster ? Can I use API feed from slideshare with JavaScript (jquery) ? Here, http://www.slideshare.net/developers/documentation I see just "Response XML Format" don't see any Json Response. Can somebody help me with that, some helpful links, or some suggestions, how can I use "Slideshare" API feeds with JavaScript. Thanks A lot !!!!!

    Read the article

  • Difficulty with jQuery and input keydown event

    - by Rosarch
    I am making a simple JavaScript enhanced list. I want it to be a list of inputs, each with an 'Add' and 'Remove' button. If the user clicks 'Add', a new li will be added. If the user clicks 'Remove', that li will be removed. It works fine, except for hitting "enter" in an <input>. Currently, it always causes the Remove.click event handler to fire, unless there's only one item in the list. I'm not sure why. How can I suppress this? Here is the complete jQuery. My attempt to fix the "enter" issue is commented out, and it doesn't work. I suspect that I could be designing this code better; if you see an improvement I'd love to hear it. function make_smart_list(list) { var ADD_CLASS = 'foo-widget-Add'; var REMOVE_CLASS = 'foo-widget-Remove'; var jq_list = $(list); jq_list.parents('form').submit(function() { return false; }); function refresh_handlers() { jq_list.find(sprintf('.%s, .%s', REMOVE_CLASS, ADD_CLASS)).unbind('click'); // jq_list.find('input').unbind('submit'); // // jq_list.find('input').submit(function() { // var jq_this = $(this); // var next_button = jq_this.nextAll('button'); // if (next_button.hasClass(ADD_CLASS)) { // next_button.nextAll('button').click(); // return; // } // // if (next_button.hasClass(REMOVE_CLASS)) { // return false; // } // // }); jq_list.find("." + REMOVE_CLASS).click(function() { var jq_this = $(this); jq_this.parent().remove(); refresh_handlers(); return false; }); jq_list.find("." + ADD_CLASS).click(function() { var jq_this = $(this); if (jq_this.prevAll('input').val() == '') { return; } jq_this.parent().clone().appendTo(jq_this.parent().parent()); jq_this.parent().next().find('input').val('').focus(); jq_this.removeClass(ADD_CLASS).addClass(REMOVE_CLASS); jq_this.text('Remove'); refresh_handlers(); return false; }); } refresh_handlers(); } (sprintf is another script I have.)

    Read the article

  • How can I scale movement physics functions to frames per second (in a game engine)?

    - by Richard
    I am working on a game in Javascript (HTML5 Canvas). I implemented a simple algorithm that allows an object to follow another object with basic physics mixed in (a force vector to drive the object in the right direction, and the velocity stacks momentum, but is slowed by a constant drag force). At the moment, I set it up as a rectangle following the mouse (x, y) coordinates. Here's the code: // rectangle x, y position var x = 400; // starting x position var y = 250; // starting y position var FPS = 60; // frames per second of the screen // physics variables: var velX = 0; // initial velocity at 0 (not moving) var velY = 0; // not moving var drag = 0.92; // drag force reduces velocity by 8% per frame var force = 0.35; // overall force applied to move the rectangle var angle = 0; // angle in which to move // called every frame (at 60 frames per second): function update(){ // calculate distance between mouse and rectangle var dx = mouseX - x; var dy = mouseY - y; // calculate angle between mouse and rectangle var angle = Math.atan(dy/dx); if(dx < 0) angle += Math.PI; else if(dy < 0) angle += 2*Math.PI; // calculate the force (on or off, depending on user input) var curForce; if(keys[32]) // SPACE bar curForce = force; // if pressed, use 0.35 as force else curForce = 0; // otherwise, force is 0 // increment velocty by the force, and scaled by drag for x and y velX += curForce * Math.cos(angle); velX *= drag; velY += curForce * Math.sin(angle); velY *= drag; // update x and y by their velocities x += velX; y += velY; And that works fine at 60 frames per second. Now, the tricky part: my question is, if I change this to a different framerate (say, 30 FPS), how can I modify the force and drag values to keep the movement constant? That is, right now my rectangle (whose position is dictated by the x and y variables) moves at a maximum speed of about 4 pixels per second, and accelerates to its max speed in about 1 second. BUT, if I change the framerate, it moves slower (e.g. 30 FPS accelerates to only 2 pixels per frame). So, how can I create an equation that takes FPS (frames per second) as input, and spits out correct "drag" and "force" values that will behave the same way in real time? I know it's a heavy question, but perhaps somebody with game design experience, or knowledge of programming physics can help. Thank you for your efforts. jsFiddle: http://jsfiddle.net/BadDB

    Read the article

  • Jquery load() loading more than I want...

    - by Probocop
    Hi, I am trying to load just the contents of a <div> into another <div> on the same page using a jquery function. But when the function triggers, it loads the entire <HTML> document into the specified <div>. Any idea why it would be doing this? My code is as follows: Jquery: function button1() { $('#sidebar-content').fadeOut(function() { $(this).load('#button1').fadeIn(); }); } function button2() { $('#sidebar-content').fadeOut(function() { $(this).load('#button2').fadeIn(); }); } HTML: <div id="content-holder"> <div id="main-content" class="float-holder"> <div id="inner"> <h1>BRAND TRUTH</h1> <div id="flashcontent"> <div id="button1"> <div id="content"> <h1>Brand Truth</h1> <p>What this basically means is our way of working, the process involved by both ourselves and our client.</p> <p>When the truth wheel process is followed, the end result is so much stronger.</p> </div> </div> <div id="button2"> <div id="content"> <h1>Button 2 Content</h1> <p>Some other content</p> <p>Some other content x2</p> </div> </div> </div> <script type="text/javascript"> // <![CDATA[ var so = new SWFObject("working.swf", "working", "400", "400", "9", "#FFFFFF"); so.write("flashcontent"); // ]]> </script> </div> <div id="sidebar"> <div id="sidebar-content"> Replace Content Here! </div> </div> </div><!-- end #main-content --> </div><!-- end #content-holder -->

    Read the article

  • touchend event doesn't work on Android

    - by Protos
    Hi, I've just started looking at doing some basic mobile web development on the android and an writing a test script to investigate the touch events. I've run the following code in the android emulator, and the touchend event never gets fired. Can anyone tell me why ? I've tried in three versions of the emulator (1.6, 2.1 and 2.2) and all three behave in the same way. Thanks in advance for any help you can give me. Cheers, Colm EDIT - I've also tried this using the XUI framework and have the same problem so I'm guessing I have a fundamental misunderstanding of how this stuff works ...... Map Test <meta name="description" content="" /> <meta name="keywords" content="" /> <meta name="language" content="english" /> <meta name="viewport" content="minimum-scale=1.0, width=device-width, height=device-height, user-scalable=no"> <script type="text/javascript"> window.onload = function(){ document.body.appendChild( document.createTextNode("w: " + screen.width + " x " + "h : " +screen.height) ); attachTouchEvents(); } function attachTouchEvents() { console = document.getElementById("console"); var map = document.getElementById("map"); map.addEventListener ('touchstart', function (event) { event.preventDefault(); var touch = event.touches[0]; document.getElementById("touchCoord").innerHTML = "S : " + touch.pageX + " " + touch.pageY; document.getElementById("touchEvent").innerHTML = "Touch Start"; }, false); map.addEventListener ('touchmove', function (event) { event.preventDefault(); var touch = event.touches[0]; document.getElementById("touchCoord").innerHTML = "M : " + touch.pageX + " " + touch.pageY; document.getElementById("touchEvent").innerHTML = "Touch Move"; }, false); map.addEventListener ('touchend', function (event) { var touch = event.touches[0]; document.getElementById("touchCoord").innerHTML = "E : " + touch.pageX + " " + touch.pageY; document.getElementById("touchEvent").innerHTML = "Touch End"; event.preventDefault(); }, false); console.innerHTML = "event attached"; } </script> <style type="text/css"> html, body { height:100%; width:100%; margin: 0; background-color:red; } #map { height: 300px; width: 300px; background-color:yellow; } </style> </head> <body> <div id="map"></div> <div id="touchCoord">Touch Coords</div> <div id="touchEvent">Touch Evnt</div> <div id="console">Console</div> </body>

    Read the article

  • jquery ui autocomplete positioning wrong

    - by mattRo55
    using jquery ui 1.8 trying autocomplete Everything works apart from that the ui-menu isn't positioned under my input element, but rather in the top left corner. Has anyone come across this problem? Here's my html: <div id="search"> <div id="searchFormWrapper"> <form method="post" name="searchForm" id="searchForm" action="/searchresults"> <label for="searchPhrase" id="searchFor"> Search for</label> <input name="searchPhrase" id="searchPhrase" type="text" /> <label for="searchScope" id="searchIn"> in</label> <select name="searchScope" id="searchScope"> <option value="">All Shops</option> ... </select> <input type="image" name="submitSearch" id="submitSearch" src="/images/buttons/search.gif" alt="Search ..." /> </form> <br class="clear" /> </div> </div> and here's my css: #search { width:100%; margin:0; padding:0; text-align:center; height:36px; line-height:36px; background:#666 url(/images/interface/info_bar_bg.gif) repeat-x top left; overflow:hidden; font-size:12px; } #searchFormWrapper { width:520px; height:36px; overflow:hidden; margin:auto; padding:0; } label#searchFor { display:block; float:left; width:80px; padding:0 5px 0 0; margin:0 0 0 0; text-align:right; } label#searchIn { display:block; float:left; width:20px; padding:0 5px 0 0; margin:0 0 0 0; text-align:right; } #searchPhrase { display:block; float:left; width:120px; margin:7px 0 0 0; padding:0; } #searchScope { display:block; float:left; width:120px; margin:7px 0 0 0; padding:0; } #submitSearch { display:block; float:left; margin:7px 0 0 10px; padding:0; } and here's my javascript: $(document).ready(function() { $("#searchPhrase").autocomplete( { source: "/search?json", minLength: 2 }); });

    Read the article

  • Rails HABTM accepts_nested_attributes_for mapping table

    - by Rabbott
    Currently I have a habtm relationship between a datastream (stream), and a chart. I want to be able to use the 'typical' jquery "add new stream" method to add a new entry into a mapping table that holds the chart_id, and stream_id.. But I think that most examples out there are made to handle a one to many relationship.. The functionality provided here by Ryan Bates is what I'm looking for, But I dont want to use checkboxes, I want to use a select (drop down) to add new items to the mapping table. I need THIS and THIS combined chart.rb class Chart < ActiveRecord::Base has_and_belongs_to_many :streams, :readonly => false, :join_table => 'charts_streams' accepts_nested_attributes_for :streams, :reject_if => lambda { |a| a.values.all?(&:blank?) }, :allow_destroy => true stream.rb class Stream < ActiveRecord::Base has_and_belongs_to_many :charts, :readonly => false, :join_table => 'charts_streams' application.js /* * Method used to add new child form partials */ $('form a.add_child').click(function() { var assoc = $(this).attr('data-association'); var content = $('#' + assoc + '_fields_template').html(); var regexp = new RegExp('new_' + assoc, 'g'); var new_id = new Date().getTime(); var newElements = jQuery(content.replace(regexp, new_id)).hide(); $(this).parent().before(newElements).prev().slideFadeToggle(); return false; }); /* * Method used to remove child form partials */ $('form a.remove_child').live('click', function() { if(confirm('Are you sure?')) { var hidden_field = $(this).prev('input[type=hidden]')[0]; if(hidden_field) { hidden_field.value = '1'; } $(this).parents('.fields').slideFadeToggle(); } return false; }); _form.html.erb <div id="streams"> <h4>Streams</h4> <% form.fields_for :streams do |stream_form| %> <%= render :partial => "stream", :locals => {:f => stream_form} %> <% end %> </div> <p><%= add_child_link 'Add a stream', :streams %></p> <%= new_child_fields_template(form, :streams) %> _stream.html.erb <div class="fields"> <p> <%= f.label :stream_id %><br /> <%= select_tag "chart[stream_ids][]", options_for_select(@streams.map {|s| [s.label, s.id]}, f.object.id) %> </p> <p><%= remove_child_link 'Remove stream', f %></p> </div> This may be overkill and what I am looking to do could be much easier.. Basically when I create a chart I want to be able to add as many streams to it as I want, using the javascript for adding a new entry, and removing an old one... Thanks for the help! This is 'working' but gives me a ActiveRecord::ReadOnlyRecord error when it hits the chart.update_attributes method.. am I adding the the :readonly = false in the wrong spot? Or am I just doing it completely wrong?

    Read the article

  • To divide the big text into columns.

    - by kalininew
    Problem: There is a big piece of the text: <div class="cont"> <p> Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit, amet, </p> <p> consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt, ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit, qui in ea voluptate velit esse, quam nihil molestiae consequatur, vel illum, qui dolorem eum fugiat, quo voluptas nulla pariatur? At vero eos et </p> <p> accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio, cumque nihil impedit, quo minus id, quod maxime placeat, </p> <p> facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet, ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat. </p> <p> Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit, amet, </p> <p> consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt, ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit, qui in ea voluptate velit esse, quam nihil molestiae consequatur, vel illum, qui dolorem eum fugiat, quo voluptas nulla pariatur? At vero eos et </p> <p> accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio, cumque nihil impedit, quo minus id, quod maxime placeat, </p> <p> facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet, ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat. </p> </div> It is necessary: To divide it on two columns. On page it should be divided on two about identical (on height) columns. If it is possible: at change of the sizes of the container of the text, a column should remain identical height. Whether probably to set number "n" - on how many columns to divide the big piece of the text. That is to divide the text into any number of columns. Is available: php, xslt, css, pure javascript (without jQuey). What tool is better for using? As it to make, that the decision was ?ross browser compatible.

    Read the article

  • Problems with multiple setIntervals running simultaneously

    - by Roel V.
    Hello, My first post here. I want to make a horizontal menu with submenu's sliding down on mouseover. I know I could use jQuery but this is to practice my javascript skills. I use the following code: var up = new Array() var down = new Array() var submenustart function titleover(headmenu, inter) { submenu = headmenu.lastChild up[inter] = window.clearInterval(up[inter]) down[inter] = window.setInterval("slidedown(submenu)",1) } function slidedown(submenu) { if(submenu.offsetTop < submenustart) { submenu.style.top = submenu.offsetTop + 1 + "px" } } function titleout(headmenu, inter) { submenu = headmenu.lastChild down[inter] = window.clearInterval(down[inter]) up[inter] = window.setInterval("slideup(submenu)", 1) } function slideup(submenu) { if(submenu.offsetTop > submenustart - submenu.clientHeight + 1) { submenu.style.top = submenu.offsetTop - 1 + "px" } } The variable submenustart gets appointed a value in another function which is not relevant for my question. HTML looks like this: <table class="hoofding" id="hoofding"> <tr> <td onmouseover="titleover(this, 0)" onmouseout="titleout(this, 0)"><a href="#" class="hoofdinglink" id="hoofd1">AAAA</a> <table class="menu"> <tr><td><a href="...">1111</a></td></tr> <tr><td><a href="...">2222</a></td></tr> <tr><td><a href="...">3333</a></td></tr> </table></td> <td onmouseover="titleover(this, 1)" onmouseout="titleout(this, 1)"><a href="#" class="hoofdinglink">BBBB</a> <table class="menu"> <tr><td><a href="...">1111</a></td></tr> <tr><td><a href="...">2222</a></td></tr> <tr><td><a href="...">3333</a></td></tr> <tr><td><a href="...">4444</a></td></tr> <tr><td><a href="...">5555</a></td></tr> </table></td> ... </tr> </table> What happens is the following: If I go over and out (for ex) menu A it works fine. If i go now over menu B the interval applied to A is now applied to B. There are now 2 interval functions applied to B. The one originally for A and a new one triggered by the mouseover on B. If I would go to A all the intervals are now applied to A. I have been searching for hours but and I am completely stuck. Thanks in advance.

    Read the article

  • Placing Varibles into an external Sheet

    - by Leslie Peer
    Trying to Build an Online D&d program which stores the character info into Tables my problem is the game works just fine while your playing but as soon as you exit game all varibles are lost which means you have to restart from scratch the next time you log on... So this is a Two Fold Question What is the Best type of External Sheet to save it on... and two How to access sheet for saving and Loading Below are Varibles <SCRIPT> Name1="Tabor Bloomfield"; Name2="Sam Wrightfield"; Name3="Gavin Hartfild"; Name4="Gail Quickfoot"; Name5="Robert Gragorian"; Name6="Peter Shain"; Class1="MagicUser"; Class2="Fighter"; Class3="Fighter"; Class4="Thief"; Class5="Cleric"; Class6="Fighter"; Level1=23; Level2=1; Level3=1; Level4=2; Level5=2; Level6=1; Hpts1=145; Hpts2=14; Hpts3=13; Hpts4=8; Hpts5=12; Hpts6=15; Armor1="Robe of Protection +5"; Armor2="Splinted Armor"; Armor3="Chain Armor"; Armor4="Leather Armor"; Armor5="Chain Armor"; Armor6="Splinted Armor"; Ac1a=5; Ac2a=3; Ac3a=3; Ac4a=4; Ac5a=2; Ac6a=3; Armor1b="Ring of Protection +5"; Armor2b="Small Shield"; Armor3b="Small Shield"; Armor4b="Wooden Shield"; Armor5b="Large Shield"; Armor6b="Small Shield"; Ac1b=5; Ac2b=1; Ac3b=1; Ac4b=1; Ac5b=1; Ac6b=1; Str1=21; Str2=16; Str3=14; Str4=13; Str5=14; Str6=13; Int1=19; Int2=11; Int3=12; Int4=13; Int5=14; Int6=13; Wis1=18; Wis2=12; Wis3=14; Wis4=13; Wis5=14; Wis6=12; Dex1=19; Dex2=14; Dex3=13; Dex4=15; Dex5=14; Dex6=12; Con1=19; Con2=15; Con3=16; Con4=13; Con5=12; Con6=10; Chr1=21; Chr2=14; Chr3=13; Chr4=12; Chr5=14; Chr6=13; </SCRIPT> File name ="gamestats" Path="trellian Webpage/droves E and F/gamestats have tryed html Page,Javascript,Creating a serperate table page and putting the varibles into cells...But at a lost on how to arrive at a solution

    Read the article

  • Problems with multiple setIntervals running simultaniously

    - by Roel V.
    Hello, My first post here. I want to make a horizontal menu with submenu's sliding down on mouseover. I know I could use jQuery but this is to practice my javascript skills. I use the following code: var up = new Array() var down = new Array() var submenustart function titleover(headmenu, inter) { submenu = headmenu.lastChild up[inter] = window.clearInterval(up[inter]) down[inter] = window.setInterval("slidedown(submenu)",1) } function slidedown(submenu) { if(submenu.offsetTop < submenustart) { submenu.style.top = submenu.offsetTop + 1 + "px" } } function titleout(headmenu, inter) { submenu = headmenu.lastChild down[inter] = window.clearInterval(down[inter]) up[inter] = window.setInterval("slideup(submenu)", 1) } function slideup(submenu) { if(submenu.offsetTop > submenustart - submenu.clientHeight + 1) { submenu.style.top = submenu.offsetTop - 1 + "px" } } The variable submenustart gets appointed a value in another function which is not relevant for my question. HTML looks like this: <table class="hoofding" id="hoofding"> <tr> <td onmouseover="titleover(this, 0)" onmouseout="titleout(this, 0)"><a href="#" class="hoofdinglink" id="hoofd1">AAAA</a> <table class="menu"> <tr><td><a href="...">1111</a></td></tr> <tr><td><a href="...">2222</a></td></tr> <tr><td><a href="...">3333</a></td></tr> </table></td> <td onmouseover="titleover(this, 1)" onmouseout="titleout(this, 1)"><a href="#" class="hoofdinglink">BBBB</a> <table class="menu"> <tr><td><a href="...">1111</a></td></tr> <tr><td><a href="...">2222</a></td></tr> <tr><td><a href="...">3333</a></td></tr> <tr><td><a href="...">4444</a></td></tr> <tr><td><a href="...">5555</a></td></tr> </table></td> ... </tr> </table> What happens is the following: If I go over and out (for ex) menu A it works fine. If i go now over menu B the interval applied to A is now applied to B. There are now 2 interval functions applied to B. The one originally for A and a new one triggered by the mouseover on B. If I would go to A all the intervals are now applied to A. I have been searching for hours but and I am completely stuck. Thanks in advance.

    Read the article

  • Uncaught TypeError: Object #<an Object> has no method 'fullCalendar'

    - by Lalit
    Hi, I have embed the fullcalender control in my asp.net mvc application. It is running fine locally. but when I uploads it to my domain server (third party) it showing me This Error: Uncaught TypeError: Object # has no method 'fullCalendar' in crome console (debugger). and not rendering the control. ** EDITED: My HTML code is this ** <%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" % Index <% var serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); % < style type='text/css' body { margin-top: 40px; text-align: center; font-size: 14px; font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; } #calendar { width: 900px; margin: 0 auto; } < script type="text/javascript" $(document).ready(function() { var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); var officerid = document.getElementById('officerid').value; url = "/TasksToOfficer/Calender/" + officerid; var currenteventIden = <%= serializer.Serialize( ViewData["iden"] ) %> var calendar = $('#calendar').fullCalendar({ header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay', border: 0 }, eventClick: function(event, element) { var title = prompt('Event Title:', event.title, { buttons: { Ok: true, Cancel: false} }); var iden = event.id; if (title) { var st = event.start; var ed = event.end; var aldy = event.allDay; var dt = event.date; event.title = title; calendar.fullCalendar('updateEvent',event); var date = new Date(st); var NextMonth = date.getMonth() + 1; var dateString = (date.getDate()) + '/' + NextMonth + '/' + date.getFullYear(); var QueryStringForEdit=null; QueryStringForEdit="officerid=" + officerid + "&description=" + title + "&date=" + dateString + "&IsForUpdate=true&iden=" + iden; if (officerid) { $.ajax( { type: "POST", url: "/TasksToOfficer/Create", data: QueryStringForEdit, success: function(result) { if (result.success) $("#feedback input").attr("value", ""); // clear all the input fields on success }, error: function(req, status, error) { } }); } } }, selectable: true, selectHelper: true, select: function(start, end, allDay) { var title = prompt('Event Title:', { buttons: { Ok: true, Cancel: false } } ); if (title) { calendar.fullCalendar('renderEvent', { title: title, start: start, end: end, allDay: allDay }, false); // This is false , because do not show same event on same date after render from server side. var date = new Date(start); var NextMonth = date.getMonth() + 1; // Reason: it is bacause of month array it starts from 0 var dateString = (date.getDate()) + '/' + NextMonth + '/' + date.getFullYear(); if (officerid) { $.ajax({ type: "POST", url: "/TasksToOfficer/Create", data: "officerid=" + officerid + "&description=" + title + "&date=" + dateString + "&IsForUpdate=false", success: function(result) { if (result.success) $("#feedback input").attr("value", ""); //$("#feedback_status").slideDown(250).text(result.message); }, error: function(req, status, error) { } }); } } calendar.fullCalendar('unselect'); }, editable: true, events: url }); }); //--------------------------------------------------------------------------// </script > <h2> Index</h2> <div id="calendar"> </div> <input id="officerid" type="hidden" value="<%=ViewData["officerid"].ToString()%>" />

    Read the article

  • Both tab & hover triggered popups problem

    - by carpenter
    I am trying to display divs when hovering over thumb-nails and/or both when tabbing onto them. If I stick to my mouse, the popups seem to work OK - if I start with a tab press I can show the popops also (foward only - no shift + tab yet). Any help getting them to play well together? <script type="text/javascript"> // Note: the below is being run from an onmouseover on a asp:HyperLink at the moment function onhovering_and_tabbingon2() { var active_hover = 0; var num_of_thumb; // set the default focus onto the first thumb-nail and make its popup display document.getElementById('link_no' + active_hover).focus(); // set focus on the first thumb $('#pop' + active_hover).toggleClass('popup'); // show its popup as it is hidden // for when hovering over the thumbs $(".box img").hover( // so as to effect only images/thumb-nails within divs of class=box when hovering over them function () { // test for if the image is a thumb-entry and not a popup image - of class=thumbs2 thumb = $(this).attr('class'); if (thumb != "thumbs2") { // I need to add/toggle the class here to a "div" and not to the image being hovered on, a div with text that corrosponds to the hovered on image though // so grab the number of the thumb_entry - to use to id the div. num_of_thumb = $(this).attr('id').replace('thumb_entry_No', ''); // find the div with id 'pop' + num_of_thumb, and toggleClass on it $('#pop' + num_of_thumb).toggleClass('popup'); // shows the hovered on pic's popup // move the focus to the hovered on pic's a tag ?????? document.getElementById('link_no' + num_of_thumb).focus(); // if the previous popup that was showing was in box2.. if (active_hover == 1 || active_hover% 2 == 1) { $('#pop' + active_hover).toggleClass('popup4_line2'); } else { // remove/toggle the previous active popup's visibility $('#pop' + active_hover).toggleClass('popup'); } // set the new active_hover to num_of_thumb active_hover = num_of_thumb; } }, function () { } ); // same thing again - but for my second row/line of entries/thumb-nails... $(".box2 img").hover( // so as to effect only images/thumbs within divs of class=box2 function () { // test if the image is a thumb-entry and not a popup image thumb = $(this).attr('class'); if (thumb != "thumbs2") { // I need to add the class here to a "div" and not to the image being hovered on, a div that corrosponds to the hovered on image though // so grab the number of the thumb_entry being hovered on, so as to id the div. num_of_thumb = $(this).attr('id').replace('thumb_entry_No', ''); // find the div with id='pop' + num_of_thumb, and toggleClass on it $('#pop' + num_of_thumb).toggleClass('popup4_line2'); // move the focus to the hovered on pic's a tag ?? document.getElementById('link_no' + num_of_thumb).focus(); // if the previous popup that was showing was in box.. // or if the active_hover is even (modulus) if (active_hover == 0 || active_hover % 2 == 0) { $('#pop' + active_hover).toggleClass('popup'); } else { // remove the previous active visible popup $('#pop' + active_hover).toggleClass('popup4_line2'); } // set the new active_hover to num_of_thumb active_hover = num_of_thumb; } }, function () { } ); // todo: I would like to try to show the popups when tabbing through the thumb-nails also // but am lost... document.onkeyup = keypress; // ???? function keypress() { // alert("The key pressed was: " + window.event.keyCode); if (window.event.keyCode == "9") { //alert("The tab key was pressed!"); active_hover = active_hover + 1; // for tabbing into box 2 (odd numbers) if (active_hover == 1 || active_hover % 2 == 1) { // toggle visibility of previous popup $('#pop' + (active_hover - 1)).toggleClass('popup'); // toggle visibility of current popup $('#pop' + active_hover).toggleClass('popup4_line2'); // } else { // for tabbing into box from box2 // toggle visibility of previous popup $('#pop' + (active_hover - 1)).toggleClass('popup4_line2'); // toggle visibility of current popup $('#pop' + active_hover).toggleClass('popup'); // } // ?????? // // if (window.event.keyCode == "shift&9") { } } } } </script>

    Read the article

  • dynamically drawing polylines on googlemaps using php/mysql

    - by arc
    Hi. I am new to the googlemaps API. I have written a small app for my mobile phone that periodically updates its location to an SQL databse. I would like to display this information on a googlemap in my browser. Ideally i'd like to then poll the database periodically and if any new co-ords have arrived, add them to the line. Best way of describing it is this; http://tiny.cc/HEIa0 In a quest to get to there, i've started on the documents on google and been modifying them to try and acheive what I want. It doesn't work - and i don't know enough to know why. I would love some advice as to why, and any pointers towards my ultimate goal would be very much welcomed. Google Maps AJAX + MySQL/PHP Example <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); map.addControl(new GSmallMapControl()); map.addControl(new GMapTypeControl()); map.setCenter(new GLatLng(47.614495, -122.341861), 13); GDownloadUrl("phpsqlajax_genxml.php", function(data) { var xml = GXml.parse(data); var line = []; var markers = xml.documentElement.getElementsByTagName("points"); for (var i = 0; i < points.length; i++) { var point = points.item(i); var lat = point.getAttribute("lat"); var lng = point.getAttribute("lng"); var latlng = new GLatLng(lat, lng); line.push(latlng); if (point.firstChild) { var station = point.firstChild.nodeValue; var marker = createMarker(latlng, station); map.addOverlay(marker); } } var polyline = new GPolyline(line, "#ff0000", 3, 1); map.addOverlay(polyline); }); } //]]> My php file is generating the following XML; <?xml version="1.0" encoding="UTF-8" ?> <points> <point lng="-122.340141" lat="47.608940"/> <point lng="-122.344391" lat="47.613590"/> <point lng="-122.356445" lat="47.624561"/> <point lng="-122.337654" lat="47.606365"/> <point lng="-122.345673" lat="47.612823"/> <point lng="-122.340363" lat="47.605961"/> <point lng="-122.345467" lat="47.613976"/> <point lng="-122.326584" lat="47.617214"/> <point lng="-122.342834" lat="47.610126"/> </points> I have successfully worked through this; http://code.google.com/apis/maps/articles/phpsqlajax.html before attempting to customise the code. Any pointers? Where am I go wrong?

    Read the article

  • Slow Jquery Animation

    - by Pyronaut
    I have this webpage : http://miloarc.pyrogenicmedia.com/ Which atm is nothing special. It has a few effects but none that break the bank. If you mouse over a tile, it should change it's opacity to give it a fade effect. This is done through the Jquery Animation, not through CSS (I do this so it can fade, instead of being a straight change). Everything looks nice when the page loads, and the fades look perfect. Infact if you drag your mouse all over the place, if gives you a "trail" almost like a snake. Anyway, My next problem is that you will see there is a box in the top left, which is going to tell you information about the tile you are hovering over. This seems to work fine. When you mouse over that information box, it switches it's position (So that you can reach the tiles that were previously hidden underneath it). From my understanding, this is all working fine, and to the letter. However, After one move of the info box (One hover). Viewing the page in Firefox turns slugish. As in, after a successful move of the info box, the fade effects become very stuttered, and it doesn't pick up events as fast meaning you can't draw a "trail" on the screen. Chrome doesn't have this issue. It seems to work fine no matter what. Safari also seems ok. Although I do notice if I move my mouse really fast, it does jump a bit but not as much as firefox. Internet explorer doesn't work at all. Seems to crash the browser... And there is an error with the rounded corner plugin im using (Not sure why...). All in all, I think whatever I'm doing inside my code must be heavily sluggish. But I don't know where it is happening. Here is the full code, but I would advise go to the link to view everything. <script type="text/javascript"> $(document).ready(function() { var WindowWidth = $(window).width(); var WindowMod = WindowWidth % 20; var WindowWidth = WindowWidth - WindowMod; var BoxDimension = WindowWidth / 20; var BoxDimensionFixed = BoxDimension - 12; var dimensions = BoxDimensionFixed + 'px'; $('.gamebutton').each(function(i) { $(this).css('width', dimensions); $(this).css('height', dimensions); }); var OuterDivHeight = BoxDimension * 10; var TopMargin = ($(window).height() - OuterDivHeight) / 2; var OuterDivWidth = BoxDimension * 20; var LeftMargin = ($(window).width() - OuterDivWidth) / 2; $('#gamePort').css('margin-top', TopMargin).css('margin-left', LeftMargin).css('margin-right', LeftMargin); $('.gamebutton img').each(function(i) { $(this).hover( function () { $(this).animate({'opacity': 0.65}); }, function () { $(this).animate({'opacity': 1}); } ); }); $('.rounded').corners(); $('.gamebutton').each(function(i) { $(this).hover(function() { $('.gameTitlePopup').html($(this).attr('title')); FadeActive(); }); }); function FadeActive() { $('.activeInfo').fadeIn('slow'); } $('#gameInfoLeft').hover(function() { $(this).removeClass('activeInfo'); $(this).fadeOut('slow', function() { $('#gameInfoRight').addClass('activeInfo'); FadeActive(); }); }); $('#gameInfoRight').hover(function() { $(this).removeClass('activeInfo'); $(this).fadeOut('slow', function() { $('#gameInfoLeft').addClass('activeInfo'); FadeActive(); }); }); }); </script> Thanks for any help :).

    Read the article

  • add remove field in java script

    - by rajanikant
    Hi every body. i want to add and remove some html input in javascript i have done for add function . it work properly. but unable to remove. my code is following fields = 1; function addInput() { if (fields != 10) { document.getElementById('text').innerHTML += "<tr><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='date[]' id='date[]' /></td><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='time[]' id='time[]' /></td><td width='20%' align='left' valign='top' class='subheading'><input type='text' name='module[]' id='module[]' /></td><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='organisation[]' id='organisation[]' /></td><td width='20%' align='left' valign='top' class='subheading' nowrap='nowrap'><input type='text' name='category[]' id='category[]' /></td><td width='20%' align='left' valign='top' class='text' nowrap='nowrap'>Add | Remove </td></tr>"; fields += 1; } else { document.getElementById('text').innerHTML += "<br />Only 10 upload fields allowed."; document.form.add.disabled=true; } } fields1=10 function removeInput() { if (fields1 !=1) { document.getElementById('text').innerHTML += ""; fields -= 1; } } and my php function is function addSession() {?> <table cellpadding="5" cellspacing="0" width="100%"> <tr> <td width="10%" align="left" valign="top" colspan="6" bgcolor="#993333" class="heading">Add Session </span></td> </tr><tr class="bgrow"> <td width="10%" align="left" valign="top" class="subheading">Datum </span></td> <td width="20%" align="left" valign="top" class="subheading">Tijd</td> <td width="35%" align="left" valign="top" class="subheading">Module</td> <td width="15%" align="left" valign="top" class="subheading">Organisatie</td> <td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap">Category</td> <td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap">Action</td> </tr> <tr > <td width="15%" align="left" valign="top" class="subheading"><input type="text" name="date_0" id="date_0" /></td> <td width="15%" align="left" valign="top" class="subheading"><input type="text" name="time_0" id="time_0" /></td> <td width="20%" align="left" valign="top" class="subheading"><input type="text" name="module_0" id="module_0" /></td> <td width="15%" align="left" valign="top" class="subheading"><input type="text" name="organisation_o" id="organisation_o" /></td> <td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap"><input type="text" name="cat_0" id="cat_0" /></td> <td width="20%" align="left" valign="top" class="text" nowrap="nowrap"><span onclick="addInput()" class="link">Add</span> | <span onclick="removeInput()" class="link">Remove </span></td> </tr> <tbody id="text"> </tbody> <?php } ?> can any one give me solution?

    Read the article

  • Plotting points so that they do not overlap if they have the same co-ordinates

    - by betamax
    Hi everyone, I have a function that takes longitude and latitude and converts it to x and y to be plotted. The conversion to X and Y is working fine and that is not what I have the problem with. I want to ensure that two points are not plotted in the same place. In one set of results there are about 30 on top of each other (because they have the same latitude and longitude), this number could be a lot larger. At the moment I am trying to achieve this by moving points to the left, right, top or bottom of the point to make a square. Once a square made up of points has been drawn, then moving to the next row on and drawing another square of points around the previous square. The code is Javascript but it is very generic so I guess it's slightly irrelevant. My code is as follows: var prevLong, prevLat, rand = 1, line = 1, spread = 8, i = 0; function plot_points(long, lat){ // CODE HERE TO CONVERT long and lat into x and y // System to not overlap the points if((prevLat == lat) && (prevLong == long)) { if(rand==1) { x += spread*line; } else if(rand==2) { x -= spread*line; } else if(rand==3) { y += spread*line; } else if(rand==4) { y -= spread*line; } else if(rand==5) { x += spread*line; y += spread*line; } else if(rand==6) { x -= spread*line; y -= spread*line; } else if(rand==7) { x += spread*line; y -= spread*line; } else if(rand==8) { x -= spread*line; y += spread*line; // x = double } else if(rand==9) { x += spread*line; y += spread; } else if(rand==10) { x += spread; y += spread*line; } else if(rand==11) { x -= spread*line; y -= spread; } else if(rand==12) { x -= spread; y -= spread*line; } else if(rand==13) { x += spread*line; y -= spread; } else if(rand==14) { x += spread; y -= spread*line; } else if(rand==15) { x += spread*line; y -= spread; } else if(rand==16) { x += spread; y -= spread*line; } else if(rand==17) { x -= spread*line; y += spread; } else if(rand==18) { x -= spread; y += spread*line; } else if(rand==19) { x -= spread*line; y += spread; } else if(rand==20) { x -= spread; y += spread*line; } if(rand == 20) {rand = 1; line++; } else { rand++; } i++ } else { line = 1; i = 0; } prevLat = latitude; prevLong = longitude; return [x,y]; } This is the output: It isn't working correctly and I don't even know if I am approaching the problem in a correct way at all. Has anyone had to do this before? What method would you suggest?

    Read the article

< Previous Page | 416 417 418 419 420 421 422 423 424 425 426 427  | Next Page >