Popular Content

Showing most liked content since 05/23/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
    Yep. The alternative is to not list the columns in the table and only give the values: INSERT INTO table VALUES ('val1', 'val2', 'val3') But, like I said, if you ever change the structure of that table then that query is going to break if you've changed the number of columns. It's best to just list everything out explicitly. You don't have to pay per character in your source code, make the code as obvious as possible so that it's easy to maintain. Ease of maintenance should always be a higher priority than something like how long the code is.
  3. 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.
  4. 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.
  5. 1 like
    PHP extension is required if you need to process data sent from form whose method is post or get using $_POST, $_GET, or $_REQUEST. IF its action is a link to another php page, then the form page can remain html, if it is sent to itself then the form page should be php.
  6. 1 like
    You can use indexOf() https://www.w3schools.com/jsref/jsref_indexof_array.asp to check if value already exists in array, if returned value equals -1 it could not be found, so it will be safe to push button non duplicate value into array.
  7. 1 like
    Each time you click a button you will have to loop through the panels array and compare its elements with the button's value. If the value was found then don't add it to the array. A for() loop and a boolean variable should be enough to do that.
  8. 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); } }
  9. 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.
  10. 1 like
    No! the alt attribute is not useless, it may be useless for those with normal sight, but for those without sight who use a 'screen reader', or hard of hearing it is a necessity.
  11. 1 like
  12. 1 like
    When you're printing each field you can check if the field ID exists in $non_matches, and style the element appropriately. I'm just suggesting that it is more efficient to print everything correct in the first place, versus printing everything then trying to run client-side code to show errors or whatever else.
  13. 1 like
    You can use scandir() to list files in a directory and generate the HTML for the images. The line breaks exist, but HTML doesn't render line breaks unless you specifically put a <br> element. You can use nl2br() to show line breaks in the text provided by users. You can't choose the size of a file, but you can give a size limit in the file uploader. There are plenty of PHP file upload tutorials, you should look at some of them. The W3Schools tutorial has sections explaining how to limit the file size and file type. You can use str_replace() to change substrings into something else, such as in the following example: <?php $string = str_replace(':)', '<img src="smiley.gif">', $string); ?>
  14. 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>
  15. 1 like
    Store the completed state of the form in the session, then check whether the session value is set before showing the panel. You can do this in Javascript with localStorage, sessionStorage or cookies. You can do it in PHP using sessions or cookies.
  16. 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.
  17. 1 like
    Also, you're never going to see a request in the network console because you're not sending the file over the network, everything is being done in the browser. You're reading the local file and updating the page, not sending it to a server. That's why there's no request to a server.
  18. 1 like
    IF you stringify the array you will simply get [ "AAAAAA" ] for single array value [ "AAAAAA","BBBBBB" ] for two array values, JSON.stringify(lsData) converts to ' [ "AAAAAA","BBBBBB" ] '. While when you use lsData = JSON.parse(localStorage.getItem("desSet"));it converts it back to a readable array of values with lsData[0] equallying "AAAAAA" and lsData[1] equallying "BBBBBB", that is what the loop does starting from 0 to less than total number of values (2) meaning 1.
  19. 1 like
    Use different id for second and just use same code to add content OR use classname instead and use var parentClass=document.getElementsByClassName("timeleftpay"); for(var i=0;i<parentClass.length;i++){ parentClass[i].innerHTML = dy + dytext + hr + hrtext + min + mintext + sec + sectext + eventtext; } Use <span class="timeleftpay"> </span>
  20. 1 like
    Here's the fix for MS kak, you would have thought they would have known better by now. // Close the dropdown if the user clicks outside of it window.onclick = function(e) { /*because of MS god complex thou shall do it how I WANT, and not how every else wants, which I thought they had finally begun to see the light, but apparently not! we have to allow for MS kak way of doing things*/ matches = e.target.matches ? e.target.matches('.dropbtn') : e.target.msMatchesSelector('.dropbtn'); if (!matches) { var myDropdown = document.getElementsByClassName("dropdown-content"); for (var i = 0; i < myDropdown.length; i++) { if (myDropdown[i].classList.contains('show')) { myDropdown[i].classList.remove('show'); } } } };
  21. 1 like
    I use Netbeans, because its not limited to just 1 or two server languages, but several, including frameworks Zend, smarty, Laravel, Java etc, It gives you traffic light indication to highlight errors in red and warnings in amber, it gives hints, in indicates what closing braces elements belong to. There is also Sublime, but I found Netbeans gives me what I want, and the ability to add more if I want.
  22. 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.
  23. 1 like
    If you're sending string values in the URL then you'll also want to use the encodeURIComponent function to make sure the values don't break the URL. Otherwise, if you're sending a lot of data you'll probably want to just switch to a post request instead of a get request.
  24. 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); };
  25. 1 like
    IF you are talking about multiple selection dropdown the value would contain 'Griffin,Swanson,Quagmire', so you would not need to change JavaScript, only the php side to split those names from $_GET['q'] For passing second variable, you have to run a function to retrieve the two values and apply to variables 'str' sames as before, and lets say 'home', then in ajax querystring xmlhttp.open("GET","getuser.php?q="+str+"&hometown="+home,true); Then in php $homeTown = strval($_GET['hometown']);
  26. 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);
  27. 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.
  28. 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.
  29. 1 like
    You can store the query results in a multidimensional array check this https://www.w3schools.com/php/func_array.asp "example 4" you can then return the array .
  30. 1 like
    Use block elements, or turn them into block elements using display: block; or display: inline-block;
  31. 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.
  32. 1 like
    header > h1, header > p{ color:red; } /*OR*/ header > h1, header > h1 + p{ color:red; } /*Give header class name */ .colour_version01 {color:red;} <header class="colour_version01"> <h1>Some text</h1> <p>Some more text</p> </header>
  33. 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.
  34. 1 like
    <span class="fruit">apple</span> <span class="fruit">orange</span> <img class="fruit_img" src=""> <img class="fruit_img" src=""> <span class="fruit">pear</span> <img class="fruit_img" src=""> <span class="fruit">pineapple</span> <img class="fruit_img" src=""> <script type="text/javascript"> $(function() { $('.fruit').each(function(i) { $('.fruit_img').eq(i).attr('src', "http://placehold.it/400x150?text=" + $(this).html()); }); }); Note even though not all images directly follow the span element, the are given the correct url of image in same sequence. i is the span index starting from 0 with class name 'fruit', img elements with 'fruit_img' class, using .eq() and index of 'i' will target these specific img elements in same sequence as they set out in within the page..
  35. 1 like
    Then all you require is to have images with the rank name that matches the written rank, then using same principle you just supply image path which can be set to a constant variable and then the img file extension. You probably need to be more specific on the img element targeted, but you could use 'fruits' class name index, to target a class name given to the rank img index ref.
  36. 1 like
    If you check the network tab of your browser's developer tools, each time you click a color you'll see a request go out for an image. Here's one of them. http://hanes.scene7.com/is/image/Hanesbrands/HNS_HO5944_ChiliPepperHeather?defaultImage=Hanesbrands/HNS_HO5944_AwesomeBlueHeather&id=Cd9S33&wid=490&hei=622&fmt=jpg
  37. 1 like
    Instead of individual ref for each, use the actual innerhtml text as the complete src ref $(this).next('img').attr('src', "http://placehold.it/400x150?text=" + $(this).html()); Equals repeating duplicate of text in src of image Equals the value that defines the complete src reference <span class="fruit">apple</span> <img src=""> <span class="fruit">orange</span> <img src=""> <script type="text/javascript"> $(function() { $('.fruit').each(function(i) { $(this).next('img').attr('src', "http://placehold.it/400x150?text=" + $(this).html()); /* if (document.getElementById("fruit").textContent == "orange") { document.getElementById("img").src = "http://placehold.it/400x150?text=orange"; } else if (document.getElementById("fruit").textContent == "apple") { document.getElementById("img").src = "http://placehold.it/400x150?text=apple"; } else if (document.getElementById("fruit").textContent == "pear") { document.getElementById("img").src = "http://placehold.it/400x150?text=pear"; }*/ }); }); </script>
  38. 1 like
    Then you would have to make tmp duplicate array, of the array of ordered selected items, loop though selected items from dropdown and if identical remove, you should end up with last item deselected. Then remove this item from original array of selected items. Use .indexOf() to find matching values.
  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
    There are three aspects to take into account in a web page: Content: HTML Presentation: CSS Behavior: Javascript The same way we want to separate content from presentation, we also want to separate content from behavior. Javascript should only be inside <script> elements, CSS should only be in <style> or <link> elements and HTML should not be polluted with attributes concerning behavior and presentation. You wouldn't use align and bgcolor attributes, so why would you use onclick attributes? In your original code, otherTongue is restricted to the local scope of the function it was declared in, it's not accessible from outside. That's why the onchange event attribute can't find it, the event attribute is looking for a global function.
  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
    First of all you can't have multiple id references, or spaces within id value, and as id must be unique within a page, you have to clone a element with unique id and temporarily apply it to variable, then remove original, then prepend temporarily cloned to a surrounding container which would make it easy to control placement and order. But first you will need an array that will store id references, that do not currently exist, in order they were selected, then looping this array you can temp clone, remove original, prepend clone.
  43. 1 like
  44. 1 like
    Buttons are inline elements, so they need to be centered by setting text-align on the parent element.
  45. 1 like
    .form-actions {width:200px; margin-left:auto; margin-right:auto; text-align:center;}
  46. 1 like
    Hi Joymis, as Ingolme said the event is being added every time the new row is added. Here is the fix - https://jsfiddle.net/rockey91/8zzq635c/
  47. 1 like
    I would look into jquery's closest() function which will search up the dom until it finds what it is looking for. Once you found the tr I think you could use jquery's index() index function closest() https://api.jquery.com/closest/ index() https://api.jquery.com/index/
  48. 1 like
    var acc = document.getElementsByClassName("accordion"); for (var i = 0; i < acc.length; i++) { acc.addEventListener("click", accordion); } function accordion() { for (var i = 0; i < acc.length; i++) { // Reset all of the elements but current selected if (acc.item(i) !== this) { acc.classList.remove("active"); acc.nextElementSibling.style.maxHeight = null; } } //check if current selected has 'active' class and remove it and next sibling, else add and show next sibling if (this.className.indexOf('active') !== -1) { this.classList.remove("active"); this.nextElementSibling.style.maxHeight = null; } else { // being a new selection and not a currently active selection add active class // Toggle the "active" class for the current item this.classList.add("active"); // Make the contents visible var panel = this.nextElementSibling; panel.style.maxHeight = panel.scrollHeight + 'px'; } }
  49. 1 like
    It's common to put basic configuration in an include file. You'll need an include file anyway for database connection details, so you can either add your other config options to the file or you can save them in the database and then have a GUI in your program to change them. If you want people to be able to log in and change various settings, those settings should go in a database. If they can't be changed by people using the program then they go in an include file.
  50. 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", ""); } }