Leaderboard


Popular Content

Showing most liked content since 08/20/2016 in all areas

  1. 2 likes
    Like astralaaron said using closest class and the index class in jquery you can get the index of the tr, have a look at the fiddle. https://jsfiddle.net/8hL46ftj/ hope this helps $('img').click(function(){ alert($(this).closest('tr').index()) })
  2. 1 like
    Do you actually have! A mail server installed and setup? They are not usually supplied by default with local server installation, but you could use 'TestMailServerTools' (google), it will listen for email being sent at a port, and show in your o/s email program, while also storing the email in question.
  3. 1 like
    IF the values in the array are taken from text type input, the numbers in array will be a string/text, it is precautionary to make sure when used in math operations that 16 + "4" don't equal "164", but 20.
  4. 1 like
    Really? maybe is a Spain hosting problem, because they show how to install here https://help.1and1.com/hosting-c37630/webspace-and-access-c85098/ssh-c37775/install-imagemagick-via-ssh-a649013.html
  5. 1 like
    (1) All form element in your current setup should appear in between <form> and </form> (2) IF using $_POST! The idea is to set a value for each checkbox so when it is submitted it is sent as $_POST array with these values. (4) IF using $_GET! THIS " window.location.assign("deleteVideo.php?id=" + id); " is a $_GET querystring, so ALL $_POST['...'] in 'deleteVideo.php' should be $_GET['...'] instead (3) As these can be multiple values the value of name attribute, should reflect it will be an array of values as in "name='checkbox[]'" (4) The 'id' argument equals WHAT? in onclick="myFunction(id)", its just text or undefined variable? (5) How can $id exist or be defined if it has not retrieved yet! $sql = mysqli_query($database, "SELECT * FROM video WHERE id='$id'"); (6) You need to make your mind up which to use $_GET or $_POST, if using the $_GET by using JavaScript to open this page then empty($_POST['delete'] will never exist. IF sent through GET querystring you would have to use $_GET['..']; instead (6) This if($val=='checked') will never be true, the $id will equal index value of array holding the value which current does not exist? as there is no value assigned to that checkbox.
  6. 1 like
    You can use Ajax to load data(images, text ....) from a separate file which contains php,asp, txt depending on what you are using once the data is ready to be displayed you can use w3 animation to make it look fancy . Here's the ajax tutorial Ajax.
  7. 1 like
    I'm not sure what code you're using to get the mouse offset, but once you have it you can calculate the correct position by dividing the canvas real size by its visible size. // Assuming we already have a reference to canvas and the mouse's position // relative to it is in visibleX and visibleY var horizontalRatio = canvas.width / canvas.offsetWidth; var verticalRatio = canvas.height / canvas.offserHeight; var realX = horizontalRatio * visibleX; var realY = verticalRatio * visibleY; // Do something with realX and realY
  8. 1 like
    Open your browser's developer tools and go to the Network tab, refresh the page and look for any failed requests to see what's missing.
  9. 1 like
    Place both if conditions for setting modal and login to display none, in a single window.onclick function
  10. 1 like
    Actually what you can do is give the input a id reference and use attribute 'for' in the label with the value of the id ref to link them and do the same as placing input within a label. <label for="male">Male</label> <input type="radio" name="gender" id="male" value="male"><br>
  11. 1 like
    If you're going to ask the same question, then it's going to be the same answer: If you don't want to use PDO and have it throw exceptions when you make a mistake, then you need to check for errors yourself. If prepare returned false, then you need to print the error message from MySQL. You have a problem with the SQL query you're trying to prepare. You changed the format of that UPDATE query between the two pieces of code and now the query is wrong. UPDATE queries do not use the same format as INSERT queries.
  12. 1 like
    Well it would help if you place the style properties within the style attribute.
  13. 1 like
    OK. The advantage of using AJAX is to prevent having to reload the page each time the form is submitted, and the advantage of using PHP is to insure that the submitted data is sanitized and validated. Are implying with this that it is not possible to use Javascript for the purpose of sanitization and validation? If I have understood correctly, AJAX serves only as an intermediary between the form page and the PHP page. In other words, the PHP page should be written, as if the AJAX did not exist, and the AJAX should always refer to the PHP page via the following piece of code $.ajax({ url: 'ajax_comment.php', What is more, the PHP code should only be included in the page, if the following condition is satisfied. !isset( $_SERVER['HTTP_X_REQUESTED_WITH'] ) Thus, it was wrong for Loois to have included the following code at the bottom of his form page include ("jquery.js"); Under the assumption that all of the above is correct, why is the following code not entered at the top of the form page? include ("jquery.js"); My very best, Roddy
  14. 1 like
    You should always provide a pure php script, to sanitize and validate, BECAUSE JavaScript CAN be disabled, You can use AJAX to update content, make database requests/update/insert etc without the need to reload the page constantly, which is required for pure php code to do the same thing. Usually you would not include the php script in the form page, only the AJAX JavaScript code would access it externally, to process the form data and return results to a specific location, it makes more sense this way checking with $_SERVER['HTTP_X_REQUESTED_WITH'] that it is a AJAX request. Without this it could be included in the form page, it would retrieve default information or content on loading of page, a AJAX request could be made using form using the same php script externally, the new AJAX returned results can be use to update/overwrite the default content without reloading the page.
  15. 1 like
    So, why use AJAX at all? Since AJAX depends on Javascript being turned on or off, and since this decision is made by the user-client, why not use PHP whose functioning is determined solely by the host-server?
  16. 1 like
    <form method="post" name="form_name" id="form_name" action="https://www.w3schools.com/comment.php"> <fieldset> <legend>Title</legend> <p>A brief explanation about what you would like to see entered.</p> <textarea name="comment" form="form_name" maxlength='400' rows="8" placeholder='Character Limit: 400'></textarea> </fieldset> <input type="submit" value="Submit comment"> </form> In addition you must decide what you want to do with the comments and how to process them one they are received via the post ($_POST) method at comment.php. Roddy
  17. 1 like
    These Email = $Post('email'}; $Password = $Post('Password'}; are supposed to be $_POST['email']; AND $_POST['Password']; and the coloured names are suppose to match the values of name attributes of inputs you are trying to read <input type="text" value="username"><br> Password:<br> <input type="text" name="lastname" value="password"><br><br> AS you can see, they match neither, and one does not even have a name attribute which is required for ALL inputs, AND name values must match exactly as 'password' is treated differently to 'Password'.
  18. 1 like
    For simple menu like yours no! The ul and li are not required, for menu that include sub or child menus, then a unordered listing (bullet list) would be preferable because of it nesting structure of UL and LI elements.
  19. 1 like
    The save() and restore() methods are useful for that. save() remembers the current state, restore brings back the state of the last save() call. ctx.save(); // Remember the current state ctx.translate(100,100); ctx.fillRect(0,0,100,100); ctx.restore(); // Return to the previous state ctx.fillRect(100,100,50,50);
  20. 1 like
    If you're using mysqli in PHP then you still need to write the SQL code. mysqli is just an extension for using MySQL, it's not an abstraction layer like you would get with Zend Db or something where you're building PHP method calls instead of writing SQL queries.
  21. 1 like
    I understand that an RSS feed is XML, but the links that go in that XML, the software used to create the XML, and the server security aren't related to XML. That's why I was asking why a question about directory security was in the XML forum. IIS is Internet Information Services, the Microsoft web server that runs on Windows. You didn't say what your environment was so I pointed out that URL rewriting can be done using htaccess in Apache, or another way in IIS. I assume nginx and other web servers also have a way to set up URL rewriting. Linux isn't a web server, it's an operating system, like Windows. Apache, nginx, IIS, etc are web servers. Your Linux server is probably running Apache. Yes. Like I mentioned, browsers often send partial requests for audio or video content. If you don't support that then the client will wait until the entire file finishes downloading before starting to play it. I'm not aware of a class that will do everything, when I implemented directory security and authorization through PHP I wrote that myself. Things might have changed since then. There might be something for your web server, like an Apache module, which is built to take a request and run a PHP script to handle authentication and authorization, or maybe a module that would check your database directly without going through PHP. I looked into some of those things but at the time I didn't find anything that perfectly matched what I was trying to do.
  22. 1 like
    The container and image are 960px wide, the .picture class element has 5px padding, the image has no percentage sizing to make it responsive, so it remains 960px wide, the 960px image is pushed because of padding 5px to the right forcing the 960px wide image to extend beyond the boundaries of .container and .picture class elements.
  23. 1 like
    You should only need one function. First set up your buttons to each have a value: <button type="button" class="add-panel" data-value="4 Panel Smooth">Add 4 Panel Smooth</button><br><br> <button type="button" class="add-panel" data-value="4 Panel Grained">Add 4 Panel Grained</button><br><br> <button type="button" class="add-panel" data-value="4 Panel Grained 2 Glazed">Add 4 Panel Grained Glazed</button><br><br> Create the list that will contain the values: <ul id="demo"></ul> Set up an event listener for the buttons: var buttons = document.getElementsByClassName("add-panel"); for(var i = 0; i < buttons.length; i++) { buttons[i].addEventListener("click", addPanel, false); } Create the event handler that updates the array and displays its contents in the HTML: var panels = []; function addPanel(e) { // Get a reference to the button that was clicked var button = e.currentTarget; // Add the button's value to the array panels.push(button.getAttribute("data-value")); // Display the contents of the array on the page by generating <li> elements. var demo = document.getElementById("demo"); demo.innerHTML = ""; var li; for(var i = 0; i < panels.length; i++) { li = document.createElement("li"); li.innerHTML = panels[i]; demo.appendChild(li); } }
  24. 1 like
    You can probably use the manifest to list every file on your site, but that's not going to necessarily make browsing faster, it might just cause the browser to sit there and download everything the first time they visit any page. It's better to have the browser cache everything as it needs it rather than to download your whole site the first time they visit any page.
  25. 1 like
    Why use success and error ajax functions when you can use .done and .fail? .done and then you do all the checks in the php script even the return so that way you don't need to do that much of a javascript code in order to display an message. For example my way i use to display messages with jquery is very simple. For example index.php <div id="return_php" style="display: none;"></div> <form id="test"> <input type="text" name="something" placeholder="Insert something ..."> <input type="submit"> </form> <script> $('#test').submit(function(e){ e.preventDefault(); $.ajax({ url: 'path/to/something.php', data: $(this).serialize(), dataType: 'html', type: 'POST' }) .done(function(data){ $('#return_php').fadeIn(400).html(data).delay(5000).fadeOut(400); }) .fail(function(){ $('#return_php').fadeIn(400).html('Something went wrong with the ajax script !').delay(5000).fadeOut(400); }) }); </script> This way you just call the php page in which you do the checks and whatever stuff and then you echo an alert which will then be displayed into the return_php div. The .delay(5000) acts as a delay for the fadeOut function, after 5 seconds the message will fade away. something.php $something = $_POST['something']; if(empty($something)) { echo "Something needs to be filled in !"; //This message will be then returned into the div return_php on the index.php page } else { //Example of database try { $sql = "SELECT something FROM something WHERE something = :something"; $stmt = $db->prepare($sql); //$db is from a config file you have to include $stmt->bindParam(":something", $something); $stmt->execute(); $rowCount = $stmt->rowCount(); //This works for every case, at least i use it this way and for me works just fine. if($rowCount > 0) //let us presume that the something has more rows { echo "Ok, there is something in that something !"; } else { echo "There is nothing in something with the something you typed !"; } } catch (PDOException $e) { echo "Error: " . $e->getMesage(); //This will be showed into the return div aswell as the echo is still a part of this page, and this page is called by ajax. } } Now, this is my way to do it time to time when i need live php script calling on my page without needing my page to refresh. Hope it helped at least for your issue with displaying messages. EDIT I've read again through your post and i think i figured out what is all about. When i try to use that ereg_replace() php function is always throwing me an Uncaught error as the function doesn't exist. This may be influencing how you are selecting the data by that variable. Instead of ereg_replace use preg_replace, It does the same thing. $email = $_POST['email']; $email = preg_replace('/\s+/, '', $email); NOTE! Some of the code i wrote may or may not fit your code if you copy paste it as it doesn't contain the same variables or functions that you wrote. You may need to adapt it to your use.
  26. 1 like
    Block elements such as div, h1, p fill the width available to them, any element below them will stack below them, if floated or not. A floated element before a block element/s, will cause the block element to merge within it, and even though the block element still take the full width, the text within them will flow to and around the edges of floated element. #1 If you place img element within the first paragraph, which you can because is a inline element and acts similar to text, It will fall below header h1, the first paragraph text will merge to edge of img element as will the second paragraphs text. For adding a div element to .content class div for extra column, you need to float and set its width to requirements.#2 and #3 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" id="viewport" content="target-densitydpi=high-dpi,initial-scale=1.0,user-scalable=no" /> <title>Document Title</title> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <script type="text/javascript"> </script> <style type="text/css"> * { box-sizing: border-box; } .header, .footer { background-color: grey; color: white; padding: 15px; } .column { float: left; padding: 15px; } .clearfix::after { content: ""; clear: both; display: table; } .menu { width: 25%; } .content { width: 75%; } .menu ul { list-style-type: none; margin: 0; padding: 0; } .menu li { padding: 8px; margin-bottom: 8px; background-color: #33b5e5; color: #ffffff; } .menu li:hover { background-color: #0099cc; } .column.content {float: right;} .column.content > img {float: left; max-width: 25%; margin: 0 8px;} .column.content > div {max-width: 25%;} .column.content > div img {max-width: 100%;} .column.content > div.left {float: left; margin: 0 8px; } .column.content > div.right {float: right; } </style> </head> <body> <div class="clearfix"> <div class="column menu"> <ul> <li>The Flight</li> <li>The City</li> <li>The Island</li> <li>The Food</li> </ul> </div> <div class="column content"><img src="https://www.w3schools.com/w3css/img_lights.jpg" alt=""> <h1>The City #1</h1> <p>Chania is the capital of the Chania region on the island of Crete. The city can be divided in two parts, the old town and the modern city.</p> <p>You will learn more about web layout and responsive web pages in a later chapter.</p> </div> <div class="column content"> <div class="left"><img src="https://www.w3schools.com/w3css/img_lights.jpg" alt=""></div> <h1>The City #2</h1> <p>Chania is the capital of the Chania region on the island of Crete. The city can be divided in two parts, the old town and the modern city.</p> <p>You will learn more about web layout and responsive web pages in a later chapter.</p> </div> <div class="column content"> <div class="right"><img src="https://www.w3schools.com/w3css/img_lights.jpg" alt=""></div> <h1>The City #3</h1> <p>Chania is the capital of the Chania region on the island of Crete. The city can be divided in two parts, the old town and the modern city.</p> <p>You will learn more about web layout and responsive web pages in a later chapter.</p> </div> </div> <div class="footer"> <p>Footer Text</p> </div> </body> </html>
  27. 1 like
    If they are child element of parent div, you need to add space before child elements. $( id + 'textarea') will look for an element with id '#letter_abstracttextarea' $( id + ' textarea') = '#letter_abstract textarea' will look for child textarea element whose parent element has this specific id.
  28. 1 like
    function lsCheck() { //Array to store Multiple values lsData = []; // if localstorage of desSet exists if (localStorage.desSet) { //get array stored in storage and apply to lsData, what was in storage is also in lsData now lsData = JSON.parse(localStorage.getItem("desSet")); //loop through array values creating elements for hold array content for (i = 0; i < lsData.length; i++) { var container = document.createElement("div"); container.className = "img_descrip_wrap"; //description var valDes = lsData[i] var des = document.createElement('p'); var tex = document.createTextNode(valDes); des.appendChild(tex); container.appendChild(des); document.body.appendChild(container); } } } //At the end of btn click function after appending new image and paragraph you have these values push into array (along with values from localstorage if exits which would have been populated by onload function) document.getElementById('btn').onclick = function() { //image var container = document.createElement("div"); container.className = "img_descrip_wrap"; //description var valDes = document.getElementById('idDes').value; var des = document.createElement('p'); var tex = document.createTextNode(valDes); des.appendChild(tex); container.appendChild(des); document.body.appendChild(container); // push (append) current value description input into array lsData.push(valDes); // apply the whole array to localstorage localStorage.setItem("desSet", JSON.stringify(lsData)); }; NOTE: this applies only to description value, and this has not been tested
  29. 1 like
    You will need an array to store the values, on page load you will check localstorage to see if values already exist, if yes, update the array with these values, then as more values are submitted, add to array and localstorage.
  30. 1 like
    Misplaced ',' instead of ' ' in margin styling, and ending semi-colon ';' for 'src = val' document.getElementById('btn').onclick = function() { var container = document.createElement("div"); container.style.maxWidth = "270px"; /* just for testing purposes dsonesuk*/ container.style.backgroundColor = "red"; /* just for testing purposes dsonesuk*/ container.style.display = "inline-block"; /* just for testing purposes dsonesuk*/ container.style.verticalAlign = "top"; /* just for testing purposes dsonesuk*/ //image var val = document.getElementById('idImage').value; var img = document.createElement('img'); src = val; /* replaced ',' with ';' dsonesuk */ img.src = src; //document.body.appendChild(img); img.style.width = "150px"; img.style.height = "150px"; img.style.padding = "10px"; //img.style.float = "left"; img.style.margin = "0px 50px"; /* removed ',' dsonesuk*/ //description var valDes = document.getElementById('idDes').value; var des = document.createElement('p'); var tex = document.createTextNode(valDes); des.style.display = 'block'; des.style.backgroundColor = "green"; /* just for testing purposes dsonesuk*/ /* des.style.top = '0px'; des.style.left = '0px'; removed because obsolete without position used dsonesuk*/ des.style.height = "160px"; des.style.padding = "10px"; des.appendChild(tex); //also tried tex.appendChild(des); container.appendChild(img); container.appendChild(des); //container.appendChild(tex); also tried this document.body.appendChild(container); }; With css and class Name <style type="text/css"> .img_descrip_wrap { display: inline-block; max-width: 270px; vertical-align: top; } .img_descrip_wrap img {width:150px; height: 150px; padding:10px; margin: 0 50px; display: block;} </style> document.getElementById('btn').onclick = function() { //image var container = document.createElement("div"); container.className = "img_descrip_wrap"; var val = document.getElementById('idImage').value; var img = document.createElement('img'); src = val; img.src = src; //description var valDes = document.getElementById('idDes').value; var des = document.createElement('p'); var tex = document.createTextNode(valDes); des.appendChild(tex); container.appendChild(img); container.appendChild(des); document.body.appendChild(container); };
  31. 1 like
    Here's how you created nested elements: /* Create a container */ var container = document.createElement("div"); /* Create children */ var image = document.createElement("img"); //... Set attributes var paragraph = document.createElement("p"); // ... Set attributes and content /* Add children to the container */ container.appendChild(image); container.appendChild(paragraph); /* Add the container to the body */ document.body.appendChild(container);
  32. 1 like
    Sure, you can do all of the layout math yourself that the browser would normally do when it positions elements. You can decide how large you want each thing to be, how much spacing between them, how large the canvas is, etc, and figure out the coordinates to draw everything. If you want to lay out everything yourself on a canvas then you can do that, you just need to do all of the math that the browser would normally do for you. If you want a border around the image and caption, for example, then you need to decide how thick the border is and account for that space, any space between the border and the inner contents, etc. The same thing goes for text, if you want the text to wrap to the next line then it's your responsibility to figure out how many pixels long the text is and where to wrap it, there's a description about that here. When you draw on a canvas you're not using CSS to position things on the canvas and then having the browser lay it all out, you're doing all of that manually and just telling the browser the coordinates to draw everything. Anyway, that's why I was wondering why you're using a canvas instead of just creating the div and img tags and adding them to the document, where the browser will handle layout, position, wrapping, etc.
  33. 1 like
    You should get in the habit of structuring your code like Ingolme mentions. Put your PHP code first that will decide what the page is even going to do, and output HTML and whatever later on. If you're just going to redirect there's no reason to output a bunch of HTML anyway, right? So figure out first if you're going to redirect or show HTML or whatever else, and then do that.
  34. 1 like
    <?php session_start(); //start the session for the page include("../include/db.php"); //include database file include("../include/settings.php"); //include configuration file //Check if page was entered by a submit button $email=$_POST['email']; //Get username !!FROM FORM!! $email = ereg_replace(" ", "", $email); //take away all spaces from username (if any) !!FROM FORM!! $password=base64_encode($_POST['password']); //Get name !!FROMFORM!! if (empty($email) || empty($password)) { echo "Empty fields";} else{ //check to see if the username or email allready excists $ck=$flash->prepare("SELECT * FROM `user` WHERE `email`=:email AND `password`=:password "); //get rows where the username or email address is allready registered $ck->bindParam(':email',$email); $ck->bindParam(':password',$password); $ck->execute(); //if email address allready excists if($ck->rowCount() > 0){ echo "user loged in successfully"; } else{ echo "Login or password inccorect";} } ?> use that phpand keep the alert(result); it should be clear now
  35. 1 like
    Use block elements, or turn them into block elements using display: block; or display: inline-block;
  36. 1 like
    Any inline element, or block element using display: inline; turning it into a inline element will not respond to width, height applied, its width will be determined by content within it.
  37. 1 like
    That would be fine if you were coding for a website, but HTML emails need to be simple. if you want it random, you'll have to create several different images with the pictures in different orders.
  38. 1 like
    You can't have block element within paragraph, move opening p tag under h2 tag. It probably corrected by adding closing tag after opening tag, which means no opening tag for ending closing p tag.
  39. 1 like
    Using jquery, - $('*').removeAttr('style'); or - $('span, div, ...').removeAttr('style'); // Specify the list of tag names for which style attribute to be removed.
  40. 1 like
    Had to make slight change, correct invalid html, which you should validate at https://validator.w3.org/ before posting <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" id="viewport" content="target-densitydpi=high-dpi,initial-scale=1.0" /> <title>Document Title</title> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <style type="text/css"> #mydropdown option:hover { background: #c8c8c8; } #mydropdown option { padding: 5px; } .mydivs1 { display: none; } br { display: block; content: ""; margin-top: 5px; } .mydivs1 { border: 1px solid black; padding: 5px; height: 211px; width: 172px; margin-left: 5px; background-color: #ff8080; } .mydivs2 { border: 1px solid black; padding: 5px; height: 199px; width: 35px; float: left; background-color: #b3e6b3; } .mydivs3 { border: 1px solid black; height: 199px; width: 103px; margin-left: 52px; padding-left: 10px; padding-right: 5px; padding-top: 5px; padding-bottom: 5px; background-color: #cce6ff; } </style> </head> <body> <input type="text" id="mytextbox" placeholder="Search Foods"> <p></p> <select id="mydropdown" multiple="multiple"> <option value="optionx_Fruits">Fruits</option> <option value="optionx_Vegetables">Vegetables</option> <option value="optionx_Nuts">Nuts</option> <option value="optionx_Meats">Meats</option> </select> <p></p> Results: <p></p> <div id="results"> <div class="mydivs1" id="optionx_Fruits"> <!--match="optionx Fruits"--> <div class="mydivs2"> <button class="button1">X</button> <p style="clear:both"></p> <button class="button2">C</button> </div> <div class="mydivs3"> <span class="myspan1">Fruits</span> <p></p> <span class="myspan2">1:</span> <br> <span class="myspan3">Avocados</span> <p></p> <span class="myspan2">2:</span> <br> <span class="myspan3">Blackberries</span> <p></p> <span class="myspan2">3:</span> <BR> <span class="myspan3">Raspberries</span> </div> <p></p> </div> <p></p> <div class="mydivs1" id="optionx_Vegetables"> <!--match="optionx Vegetables"--> <div class="mydivs2"> <button class="button1">X</button> <p style="clear:both"></p> <button class="button2">C</button> </div> <div class="mydivs3"> <span class="myspan1">Vegetables</span> <p></p> <span class="myspan2">1:</span> <br> <span class="myspan3">Beets</span> <p></p> <span class="myspan2">2:</span> <br> <span class="myspan3">Eggplants</span> <p></p> <span class="myspan2">3:</span> <BR> <span class="myspan3">Spinach</span> </div> <p></p> </div> <p></p> <div class="mydivs1" id="optionx_Nuts"> <!--match="optionx Nuts"--> <div class="mydivs2"> <button class="button1">X</button> <p style="clear:both"></p> <button class="button2">C</button> </div> <div class="mydivs3"> <span class="myspan1">Nuts</span> <p></p> <span class="myspan2">1:</span> <br> <span class="myspan3">Almonds</span> <p></p> <span class="myspan2">2:</span> <br> <span class="myspan3">Pecans</span> <p></p> <span class="myspan2">3:</span> <BR> <span class="myspan3">Walnuts</span> </div> <p></p> </div> <p></p> <div class="mydivs1" id="optionx_Meats"><!--match="optionx Meats"--> <div class="mydivs2"> <button class="button1">X</button> <p style="clear:both"></p> <button class="button2">C</button> </div> <div class="mydivs3"> <span class="myspan1">Meats</span> <p></p> <span class="myspan2">1:</span> <br> <span class="myspan3">Chicken</span> <p></p> <span class="myspan2">2:</span> <br> <span class="myspan3">Fish</span> <p></p> <span class="myspan2">3:</span> <BR> <span class="myspan3">Turkey</span> </div> <p></p> </div> </div> <p></p> <!-- Original script --> <script type="text/javascript"> /* jQuery.fn.filterByText = function(mytextbox) { return this.each(function() { var select = this; var options = []; $(mydropdown).find('option').each(function() { options.push({ value: $(this).val(), text: $(this).text() }); }); $(mydropdown).data('options', options); $(mytextbox).bind('change keyup', function() { var options = $(mydropdown).empty().data('options'); var search = $.trim($(this).val().replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&")); var regex = new RegExp(search, "gi"); $.each(options, function(i) { var option = options[i]; if (option.text.match(regex) !== null) { $(mydropdown).append( $('<option>').text(option.text).val(option.value) ); } }); }); }); }; $(function() { $('#mydropdown').filterByText($('#mytextbox'), true); });*/ /* $(document).ready(function() { function exists(elemt, arr) { return (jQuery.inArray(elemt, arr) > -1); } $('#mydropdown').change(function() { var $selected = $(this).val(); $('.mydivs1').each(function() { $(this).toggle()[ (exists($(this).attr('match'), $selected)) ? 'show' : 'hide'](); }); }); });*/ </script> <!--NEW Script --> <script> var SelOrderArray = []; $('#mydropdown').on('change keyup', function() { $('.mydivs1').hide(); var $selected = $(this).val(); if ($selected.length > 0) { $.each($selected, function(i) { //loop through selected possible multiple selected options if (SelOrderArray.indexOf($selected[i]) === -1) { //if current looped through $selected value not in array then add to array SelOrderArray.push($selected[i]); } }); } else { SelOrderArray.push($selected[i]); } // loop through ordered array of slected options $.each(SelOrderArray, function(i) { //clone element with specific id to temp storage variable var TmpDivClone = $("#" + SelOrderArray[i]).clone(); //remove current existing element with specific id $("#" + SelOrderArray[i]).remove(); // prepend temp cloned element to div #result wrapping mydiv1 elements so prepending remains below dropdown and show TmpDivClone.prependTo('#results').show(); }); }); </script> </body> </html>
  41. 1 like
    var SelOrderArray=[]; $.each($selected,function(i){ //loop through selected possible multiple selected options if(SelOrderArray.indexOf($selected[i]) === -1){ //if current looped through $selected value not in array then add to array SelOrderArray.push($selected[i]); } }); // loop through ordered array of slected options $.each(SelOrderArray,function(i){ //clone element with specific id to temp storage variable var TmpDivClone = $("#"+SelOrderArray[i]).clone(); //remove current existing element with specific id $("#"+SelOrderArray[i]).remove(); // prepend temp cloned element to div #result wrapping mydiv1 elements so prepending remains below dropdown and show TmpDivClone.prependTo('#result').show(); }); Not tested, written on tablet
  42. 1 like
  43. 1 like
    With the code I provided, it does not require being placed in function, it runs its own anonymous function if a specific classed element within a specific parent id element is clicked even if a specific currently classed element already exists OR is newly created which is what 'on()' is specifically used for.
  44. 1 like
    Every time you create a new row you're adding another event handler to all the rows. The newest row will have just one event handler, but the older rows will have as many event handlers as times you've clicked the "new" button.
  45. 1 like
    Add 'this' to the function called by anchor link event onclick <a onclick="myAccFunc(this)" href="#">First group<i class="fa fa-caret-down"></i></a> Then you need to ref that specifically clicked element, transverse down to next sibling element and change that elements classname function myAccFunc(elem)//amended by dsonesuk { var x = elem.nextElementSibling;//amended by dsonesuk if (x.className.indexOf("w3-show") == -1) { x.className += " w3-show"; x.previousElementSibling.className += " w3-green"; } else { x.className = x.className.replace(" w3-show", ""); x.previousElementSibling.className = x.previousElementSibling.className.replace(" w3-green", ""); } }
  46. 1 like
    I don't think that it would be a bad thing personally, as a lot of popular frameworks like Angular 2 and React are using ES6 and TypeScript in their tutorials and so are a lot of the blogs and guides. That said, there will still be the requirement of needing a transpiler for the time being but, I certainly think there are lots of tutorials and guides around that too, however, at the risk of linking people off site to other tutorials (for Babel, TypeScript, Webpack, Gulp, etc) I could see W3Schools being hesitant in that regard as well. Either way, I firmly encourage any intermediate JS developer to start learning ES6 features now and consider taking the extra time to learn how to transpile that source code down to ES5 compatible JS. New features, like imports have fundamentally helped changes the language (for the better IMO) and I think the resulting source code is better for it too.
  47. 1 like
    It's never a good idea to dynamically create tables. Database are designed to handle millions of records, so I would recommend having just one table for the tickets.
  48. 1 like
    It is a nice way to interact with GitHub, but it isnt a GUI for just using Git. Still, very useful since sometimes its hard to remember the commands for pushing to GitHub like "git push origin master"
  49. 1 like
    Vi.. not unless I have to! Nano is superior, in my opinion. It is much easier to use and just as functional. I can't imagine a situation that I would use Vi, although, if I needed to, I can manage with it.unrelated: glad to see my list got added to the poll
  50. 1 like