iwato

Security is necessary when others have access to your database. PHP is only visible to you. A form, on the other hand, is visible to everyone, and the data passed to your database via the form can be entered by anyone. Roddy If what i write has been of help, please do not forget to say thanks. Hover over the heart and click on the trophy.

appear => appears Sorry, the host of Grammar Captive errs on occasion. Roddy

Sure, but I have no desire to be controlled by Google. Roddy

You have two choices: one, you can use the CSS float property, or you can use Flexbox which is also a form of CSS. Although your page seems well-structured, it does not appear to be responsive in design. For this reason I suggest that you use the float property. Roddy If you find my response useful, please do not forget to say thanks by hovering over the heart and clicking on the trophy.

Thank you for your insight. I believe that you have saved me much wasted effort. I have decided to go with Matomo. I am not expecting it to be the easiest implementation in the world, but it does appear to be comprehensive and well documented. Best of all, it is open source and appears to be used by reputable companies. Hopefully my bad experience with RSS feeds has taught me a lesson. Go where the documentation is best Roddy

BACKGROUND: I found the appended script on the net and am inclined to believe that it could prove very useful. i would like to share it with you in the hope that those better versed in Javascript than I might provide insight into its proper use. The annotation enclosed as follows /* ... */ is mine and may be inaccurate. /* * Brief Description: A script for tracking in real time. * Date: 20 February 2018 (downloaded from internet) * Source: Neezer at Stackoverflow * Link: https://stackoverflow.com/users/32154/neezer */ /**************************************************************************************** Gets element by class name, assigns each to an element of an array, and returns the array. Apparently, the class name is trackit. ****************************************************************************************/ if (document.getElementsByClassName === undefined) { document.getElementsByClassName = function(className) { var hasClassName, allElements, results, element; hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)"); allElements = document.getElementsByTagName("*"); results = []; for (var i = 0; (element = allElements[i]) !== null; i++) { var elementClass = element.className; if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass)) { results.push(element); } } return results; }; } /**************************************************************************************** * The function that is called when a tracked element is clicked and sets the tracking in motion. ****************************************************************************************/ function addTracker(obj, type, fn) { // adds a tracker to the page, like $('xxx').event if (obj.addEventListener) { obj.addEventListener(type, fn, false); } else if (obj.addEventListener) { obj['e' + type + fn] = fn; obj[type + fn] = function() { obj['e' + type + fn]( window.event ); }; obj.attachEvent('on' + type, obj[type + fn]); } } /**************************************************************************************** * Creates a query string with the tracked information and assigns it to a relative path leading to a PHP processing file. ****************************************************************************************/ function save_click(passed_object) { // this function records a click var now, then, path, encoded, to, from, name, img; now = new Date(); path = '/lib/click.php'; from = (window.decode) ? window.decodeURI(document.URL) : document.URL; to = (window.decodeURI) ? window.decodeURI(passed_object.href) : passed_object.href; name = (passed_object.name && passed_object.name != '') ? passed_object.name : '[No Name]'; // timestamp the path! path += '?timestamp=' + now.getTime(); path += '&to=' + escape(to) + '&from=' + escape(from) + '&name=' + name; // compile the path with the recorded information img = new Image(); img.src = path; // when we call the image, we poll the php page; genius! while (now.getTime() < then) { now = new Date(); // resets the timer for subsequent clicks } } /************************************************************************************************* * Fetches the targeted links by their class assignment and attaches the event handler save_click() *************************************************************************************************/ function get_targeted_links(target) { var links, link; if (document.getElementsByClassName) { links = document.getElementsByClassName(target); for (var i = 0; i < links.length; i++) { link = links[i]; if (link.href) { addTracker(links[i], 'mousedown', save_click(links[i])); } } } } /************************************************************************************************* * The Function Call - Calls the addTracker() function and loads the get_targeted_links() function. *************************************************************************************************/ addTracker(window, 'load', get_targeted_links('trackit')); The following is my understanding of the script and my confusion with same. I am requesting that you help to unravel my confusion, so that I might easily implement the script. SET UP 1) The class name 'trackit' is assigned to those elements on a page that the users wishes to track. 2) The entire script is loaded into the page at the outset by a <script> tag in the <head> element of the document. 3) In the document's jQuery ready( ) function is inserted the call to the addTracker( ) function. 4) When the page is loaded the activity of the elements to which the class name 'trackit' has been assigned is tracked. 5) Each time a click event takes place, the gathered information is assigned to a query string and appended to a relative path that points to a PHP processing file. WHAT I DO NOT UNDERSTAND 1) Although it appears that the tracked elements are stored in an array called results, the relationship between the activity that is tracked for each element of the array and the array itself is unclear. In effect, the user can easily know which elements are being tracked, but to what use is this information when all of the tracking information is stored in a query string? 2) There appears to be know mechanism for sending the query string to the designated relative path -- namely, .../lib/click.php. For example, when sending form data to a PHP processing file, the type-submit, input control initiates the HTTPRequest. 3) The author has added the comment "adds a tracker to the page, like $('xxx').event". I simply do not understand the meaning or use of the expression $('xxx').event in this context. is it not enough to simply assign the class name 'trackit' to each element that the user wishes to track. HAVE I UNDERSTOOD THE FOLLOWING CORRECTLY timestamp // When the click event takes place. from // the URL of the document on which the click event takes place. to // the address of the document called when the click event takes place. name // a property of the passed event object that identifies the object -- perhaps, the value of a name or id attribute. Finally, please comment on my annotations, if you feel that they do not properly explain the role of the function. Roddy Good documentation is a somewhat rare commodity on the internet.

Under the assumption that the XML files are uniformly constructed. Why not construct a table in a database that could accommodate all of the XML items in your files, and then write a PHP routine that would extract the values of each item in each file and insert them into the data table? I know. I was also very hesitant to start using a database, but I am very glad that I did. For, it is everything at your fingertips -- anything, anywhere, anytime, in any order, and as much or as little as you want. Roddy

Why are you using prepared statements to show table fields? It seems excessive. By the way, in your case $mysqli_obj = $conn;

BACKGROUND: Please compare the Select Language <select> element option menu under the headings Free Webinar and Newsletter/Subscribe found in the navigation bar on the Grammar Captive main page. Therein lies the heart of the following question. QUESTION: How does one set the background and text colors of the <optgroup> element so that they appear properly in Firefox? Neither optgroup { background: black; color: white; } nor optgroup { background-color: black; color: white; } appear to work. Roddy

$db_name = "..."; $tbl_name = "..."; $sql = "SHOW FULL COLUMNS IN " . $tbl_name . " IN " . $db_name; $result_obj = $mysqli_obj->query($sql); while ($row = $result_obj->fetch_assoc()) { foreach ($row as $key => $value) { echo "<span style='font-weight:bold;'>" . $key . "</span>: <span style='color:red;'>" . $value . '</span><br />'; } echo '<hr>'; } Roddy

Yes, Dsonesuk. You are so often, so accurate. You deserve the highest accolade. I am now targeting the <input> form control directly, rather than the <div> element in which it is contained. All it took was an additional line of code. My future users will have much for which to thank you. The new implementation has already begun. You can see it in the Weekly Podcasts panel of the Grammar Captive mainpage. Roddy p.s. The FIX $('#pc_other').hide(); $('#pc_tongue').change(function() { if ($('#pc_tongue').val() == 'other_tongue') { $('#pc_other').show(); $('#pc_other_input').focus(); } else { $('#pc_other').hide().focusout(function(){ $("label#pc_tongue_error").hide(); }); } });

OK, guys! I have made the switch. I have eliminated the multiple and simultaneous animations and switched to click. All that remains is getting the cursor to appear properly, but this should be much easier to achieve. Many thanks! Roddy

The PROBLEM: The problem can be observed on the internet at overview.html. After the page opens: Find the words Weekly Podcasts in the page's navigation bar and click on them. After the page opens find the Seven Gates subscription form. Find the select control called Select a Language and click on it. Scroll to the bottom of the list until you arrive at the Not found? option and click where it says Click and enter! If the focus transfers to the newly opened window, then you can see something that I cannot. This failure to transfer focus is the problem. QUESTION: Why does the following code fail to realize the aforesaid mentioned transfer of the focus from the window containing the phrase Click and enter! to the newly opened, blank window? In effect, users cannot enter a missing language without first placing the cursor into the newly opened window. They cannot simply being typing after they click on the words Click and enter!. Alas. HTML <div id='pc_language_options' style='clear:both;'> <label for='pc_tongue'>Native Tongue:<span class="formlabel">*</span></label> <span class="rightfloat"> <select id="pc_tongue" name="language" style="width:auto;"> <option selected value="0">Select Language</option> ... <optgroup label='oceania'> <option value=mi>Maori</option> <option value=haw>Hawaiian</option> <option value=sm>Samoan</option> </optgroup> <optgroup label='Not found?'> <option id="not_found" value='other_tongue'>Click and enter!</option> </optgroup> </select> </span> </div><!-- end div#pc_language_options --> <div id='pc_other' style='margin-top:0.8em;'> <span class="rightfloat"><input id='pc_other_input' type='text' name='other' value=''></span> </div><!-- end div#pc_other --> <label id="pc_tongue_error" class="error" for="pc_tongue">This field is required.</label> JAVASCRIPT $('#pc_other').hide(); $('#pc_tongue').change(function() { if ($('#pc_tongue').val() == 'other_tongue') { $('#pc_other').show().focus(); } else { $('#pc_other').hide().focusout(function(){ $("label#pc_tongue_error").hide(); }); } }); By the way, this is hardly where my experimentation stopped. I have tried many ways using different combinations of the show(), hide(), focus(), focusin(), blur(), and focusout() functions -- and these, both with and without callback functions. Unfortunately, to no avail. I have learned, in effect, many different ways to mess up what already works, but I simply cannot get it to work with the desire enhancement -- a transfer of focus. Roddy

Thanks! I now rated as "Good", rather than "Neutral". Roddy

Great! I am glad that I could be of help. Now, hover over the heart and when you see the trophy, click on it! This will advance my W3Schools "notoriety"....

Yes. Is there anything in the included file db.php that produces printed output -- say, an echo(), print_r(), or similar such statement? Roddy

Hooray! Hooray! Hooray! Thank you, Dsonesuk. I found the extra </div> tag and removed it. Experiment Two now produces an outcome similar to Experiments One and Three. Two thirds of a day were spent in an effort to overcome this problem. As always, the time was not completely wasted, for I successfully eliminated the scoped style attribute from my imported <div> and made my page more browser robust. What is more I was introduced to a new HTML and CSS checker. But, still ... Roddy

Thank you, Dsonesuk! The gap was removed when I eliminated the bottom margin. Solving one problem appears, however, to have created another. Please compare the placement of the footer in Experiments One and Two! I had a look at the https://validator.w3.org/nu/ results, and they are certainly more revealing than what I have been able to obtain with BBEdit. This said, it may be due to my lack of knowledge of the refinements of BBEdit, than BBEdits' short-comings. I keep discovering more about BBEdit as time passes. In any case, I must disappear for a couple of hours before I can give them the attention that they are obviously due. In the meantime, if you have any more suggestions, please let me know. It appears obvious that the source of the problem lies in the absence and presence of the following two optionally inserted resources: $("<link/>", { rel: "stylesheet", type: "text/css", href: "./_utilities/css/podcast_list.css" }).appendTo("head"); $("<link/>", { rel: "stylesheet", type: "text/css", href: "./_utilities/css/podcast_select.css" }).appendTo("head"); For, these are absent when the podcast_hostpage.php is accessed with a query statement external to the webpage (Experiment Two). Roddy

I do not see any. There are quite a few HTML comment tags, and I am generally suspicious about how they function in the presence of other code. Do you see a potential source of problem in the use of HTML comment tags: <!-- ... --> Roddy

OK. I did a very thorough check of the HTML page podcast.hostpage.php and even revised certain aspects of the HTML and javascript. What I found were several structural problems that were not picked up by the BBEdit HTML checker including a <header> element that had not been closed, as well as unclosed <li> and <p> tags. I learned an important lesson. All that appears well, may not be well. Correcting these errors, however, did not solve the problem. Please try again. Roddy

I just checked with the suppression of the PHP element, and my editor could find no error. Any other suggestions? Roddy

I will check. I use BBEdit as my software and regularly use its HTML checker to insure proper that my HTML elements are properly specified. I have noticed that the editor does not know how to account for the presence of PHP and confuses the opening and closing tags for PHP with HTML. I will suppress those tags and check again. Let's see what happens. Thanks. Roddy

EXPERIMENT ONE: Open to the Grammar Captive Podcast Hostpage without a Query. Observe the vertical alignment of the sidebar in relationship to the page's banner. If you experience the same as I, the sidebar will be top aligned with both the navigation and middle content panels. EXPERIMENT TWO: Open to the Grammar Captive Podcast Hostpage with a Query String Attached to the HTTPRequest Open to the Proxy Request Page. Click where it says Proxy Link. Observe the middle panel that opens. It should be a reference to Podcast No. 21. Observe the vertical alignment of the sidebar in relationship to the page's banner and other aforementioned elements. If you experience the same as I, the sidebar is no longer top-aligned with the page's navigation bar and middle content panel. EXPERIMENT THREE: Repeat Experiment One, but Open to the Podcast No. 21 Panel from the Already Opened Page. Click where it says ALL in the navigation bar. Click on the phrase Podcast Index ... Find Podcast No. 21 Click where it says Discover more ... Click on the command Click and Listen. Observe the alignment of the sidebar. It remains top aligned with the navigation bar and middle panel. QUESTION ONE: How might one explain this phenomenon? QUESTION TWO: And, what corrective action can be taken to prevent it? Roddy

Well, in any case, it worked. i can now replace file content with other file content in the same domain from a call in the same or other domain. From third party domain: https://www.grammarcaptive.com/overview.html?newsletter=1 From same domain: Go to the Grammar Captive Podcast Hostpage Find the menu item called Seven Gates in the navigation bar Open the Details option and click on the phrase Subscribe ... Hooray! Hooray! Hooray! Roddy ps. Apparently the called function is called an IIFE (Immediately Invoked Function Expression).

What I mean by insert is to replace the contents of a <div> element on the host page with hidden contents on the same page or the contents of another page. In the current scenario I am replacing a <div> element on the host page with the contents of another page. Roddy