JavaScript - Best & Easiest Integration For Posts?
So, I've designed a basic site and everything is fine except for the posts. You can see the site here.
What I'm talking about is this: Code: <div id="posts"> <h1>Bonjour</h1> <p>Welcome to my website! Please note that it's fairly new, and so it might still go under some construction, so don't expect what you see now to be stay the same forever. Furthermore, if you have any suggestions, please run them by me and I'll take them into consideration.</p> <p>As of 9/23: Working on Adding Games.</p> <br> </div> The CSS code for it is: Code: #posts{text-indent:15px;background-color:#424242;border:3px solid #e0e0e0;position:absolute;left:212px;top:180px;width:565px;} Now, the post is only one post, and I can't add any more as it is only one div. I was wondering if there was an easy way to make a master, parent div and all the div's inside it would be transformed into div's that are respectively positioned under it, automatically. ^^ Now, I liked that idea at first but then I thought of the technicalities such as having to use HTML to write blog posts which would be kind of ridiculous and I was wondering if anyone knows how of a simple-free easy to integrate blog system which could be embedded into my site without having to re-design everything. Similar TutorialsHello, I was wondering what the easiest and best way for a beginner like myself to set up a keypad with numbers only and have them incorporate it to a text area or box, basically the user will click the button and the number that is pressed will show up in the textarea or text box. I am wondering what the best way to do this is. Code: <input type="image" id="1" src="Button1.gif" alt="Calculator Button #1"/> This is the line of code (an example of it) that I am working with. So my question is what is the best way to do this. Thanks for the help. I need a simple handy utility of some sort to test out the scripts while I am studying, any referrals please?
OK so I have a variable called url and I want to move its contents into the form action once the button is submitted. <script type="text/javascript"> function elibrarySearchGo(){ var url = "http://url'" } </script> <form name="searchform" target="_blank" action="" onsubmit=""> I need the syntax as to how to put in a variable coming from javascript inside onsubmit="document.form.action.value = variable" for example. Also, is it better to run this population of the action onsubmit or onclick? Thanks all in advance!! I plan to set up a photo gallery using ShadowBox, but I also want to add a zoom feature within the gallery for individual elements. Preferably using the CloudZoom plugin. How it should (hopefully) work: Click on any thumbnail --> A resized large image opens up inside ShadowBox --> CloudZoom is activated on this image on mouseover. What I've obviously got so far is this: Code: Shadowbox.init({ skipSetup: true }); window.onload = function() { Shadowbox.setup("a.mygallery-elements", { gallery: "mygallery" }); }; Is there a way to call CloudZoom after the gallery is invoked. Have already scoured this forum. No luck. Can anyone out there advise me on this? Hi, I have this code that can be used to simulate the F11 function in the Internet Explorer. Code: <script type="text/javascript"> function F11() { window.open("page.html", "", "channelmode"); } </script> and you call it by adding this to a html link : Code: <a href="javascript:F11()">click here to open in channelmode</a> or Code: <body onload="javascript:F11()"> the problem is that when the function was written, , it said to open "page.html" in channel mode. I want to open the page itself in channelmode onload... not "page.html" how can I modify the function? something like...window self open! thanks Hi, I have a form which goes to my insert page which inserts the data into the table. Except I didn't want to do a redirect to another page so I thought I would do an Ajax call. Both pages work until I change it to an ajax call. I am pretty certain that it is because I took out the <form action="insert.php"> because otherwise the page would redirect but if that is the case I don't know my way around it and if it isn't the problem I'm not sure what is. But here is my code: Form: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> <html><head> <script type="text/javascript"> function loadXMLDoc(File,ID){ if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("POST",File,true); xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } xmlhttp.send(); } </script> </head> <body> <div id="txtHint"> <form action="" method="post"/> <div class="scroll"> <textarea rows="6" cols="60" class="input" name="para1" required="required" onclick="clearMe(this)"> Insert Paragraph 1 </textarea> </div> <br /> <br /> <div class="scroll"> <textarea rows="6" cols="60" class="input" name="para2" onclick="clearMe(this)"> Insert Paragraph 2 </textarea> </div> <br /> <br /> <input type="submit" value="Submit" onclick="loadXMLDOC('insert.php','txtHint')" /> </form> </div> </body> And my insert.php is: Code: <?php $con = mysql_connect("localhost","user","password"); if (!$con){ die('Could not connect: ' . mysql_error()); } mysql_select_db("mydb", $con); $sql="INSERT INTO abc (para1, para2, date, time) VALUES ('{$_SESSION['para1]}', '{$_POST['para2']}',CURDATE(), CURTIME())"; mysql_query($sql) or die('Error: ' . mysql_error()); mysql_close($con) ?> For a project in my high school web design class, I need to integrate an Excel spreadsheet as data so to speak for a web page. I want to pull the prices from the sheet, and make them appear on the page. I'd like to pull it from the sheet so that the client can still adjust and edit the prices without having to reach the actual webpage. Conceptually, I thought this would be fairly straight forward, but in researching how to do this, I got very confused. I'm not even positive that I'm putting this in the right section. So my main question is this: Is there a way to integrate an Excel spreadsheet in such a way that it can provide data for certain fields of a webpage? If so, can someone please explain how? Thanks, A Confused High School Girl Hi all, Maybe I'm missing something simple here, but for some reason this form validates in both IE and Firefox, but it doesn't submit in IE. Little yellow exclamation icon appears on the status bar on form submit. Any help would be great. Thanks! Code: /* Creation Date: Dec 8, 2009 Description: */ function validate_school_form() { var valid = false; var error = ""; if (element("fname").value.length < 1 ){ error += "Please enter your first name.<br/>"; element("fname").style.border = "1px solid red"; } else { element("fname").style.border = ""; } if ( element("lname").value.length < 1 ){ error += "Please enter your last name.<br/>"; element("lname").style.border = "1px solid red"; } else { element("lname").style.border = ""; } if ( !validate_email_address(element("email").value) ){ error += "Please enter a valid email address.<br/>"; element("email").style.border = "1px solid red"; } else { element("email").style.border = ""; } if ( element("addr").value.length < 1 ){ error += "Please enter your street address.<br/>"; element("addr").style.border = "1px solid red"; } else { element("addr").style.border = ""; } if ( element("zip").value.length != 5 || isNaN(element("zip").value) ){ error += "A zip code must be 5 digits.<br/>"; element("zip").style.border = "1px solid red"; } else { element("zip").style.border = ""; } if ( element("city").value.length < 1 ){ error += "Please enter your city.<br/>"; element("city").style.border = "1px solid red"; } else { element("city").style.border = ""; } if ( element("state").value.length < 1 ){ error += "Please enter your state.<br/>"; element("state").style.border = "1px solid red"; } else { element("state").style.border = ""; } if (( element("phone1").value.length != 3 ) || ( element("phone2").value.length != 3 ) || ( element("phone3").value.length < 4 ) ){ error += "Please enter a valid phone number.<br/>"; element("phone1").style.border = "1px solid red"; element("phone2").style.border = "1px solid red"; element("phone3").style.border = "1px solid red"; } else { element("phone1").style.border = ""; element("phone2").style.border = ""; element("phone3").style.border = ""; } if ( element("gender").selectedIndex == 0 ){ error += "Please enter your gender.<br/>"; element("gender").style.border = "1px solid red"; } else { element("gender").style.border = ""; } if ( element("birth_day").selectedIndex == 0 ){ error += "Please enter a valid day of birth.<br/>"; element("birth_day").style.border = "1px solid red"; } else { element("birth_day").style.border = ""; } if ( element("birth_month").selectedIndex == 0 ){ error += "Please enter a valid month of birth.<br/>"; element("birth_month").style.border = "1px solid red"; } else { element("birth_month").style.border = ""; } if ( element("birth_year").selectedIndex == 0 ){ error += "Please enter a valid year of birth.<br/>"; element("birth_year").style.border = "1px solid red"; } else { element("birth_year").style.border = ""; } if ( element("program_type").selectedIndex == 0 ){ error += "Please enter your program of interest.<br/>"; element("program_type").style.border = "1px solid red"; } else { element("program_type").style.border = ""; } if ( element("level_of_education").selectedIndex == 0 ){ error += "Please enter your level of education.<br/>"; element("level_of_education").style.border = "1px solid red"; } else { element("level_of_education").style.border = ""; } if ( error != "" ){ alert('Error! Please fix the marked fields for missing or wrong information.'); return false; } else { var d = new Date(); var o = element("birth_year"); var birth_year = o.options[o.selectedIndex].value; if (birth_year <= (d.getFullYear()-22)) { submit_school_form(); } else { goToStep3(); } } } function submit_school_form() { var o = ""; var text = "http://xxxxxx.com/engine/directpost?"; //var text = "../response2.php?"; text += "CID=" + encodeURIComponent(element("CID")); text += "first=" + encodeURIComponent(element("fname").value); text += "&last=" + encodeURIComponent(element("lname").value); text += "&mail_addr_1=" + encodeURIComponent(element("addr").value); text += "&mail_city=" + encodeURIComponent(element("city").value); text += "&mail_stateprov=" + encodeURIComponent(element("state").value); text += "&mail_postalcode=" + encodeURIComponent(element("zip").value); text += "&email=" + encodeURIComponent(element("email").value); var phone = element("phone1").value + element("phone2").value + element("phone3").value text += "&home_phone=" + encodeURIComponent(phone); o = element("birth_day"); var birth_day = o.options[o.selectedIndex].value; text += "&bdate_day=" + encodeURIComponent(birth_day); o = element("birth_month"); var birth_month = o.options[o.selectedIndex].value; text += "&bdate_month=" + encodeURIComponent(birth_month); o = element("birth_year"); var birth_year = o.options[o.selectedIndex].value; text += "&bdate_year=" + encodeURIComponent(birth_year); o = element("gender"); var gender = o.options[o.selectedIndex].value text += "&gender=" + encodeURIComponent(gender); o = element("program_type"); var program_type = o.options[o.selectedIndex].value text += "&program_type=" + encodeURIComponent(program_type); o = element("level_of_education"); var level_of_education = o.options[o.selectedIndex].value text += "&level_of_education=" + encodeURIComponent(level_of_education); text += "&user_ip=" + encodeURIComponent(element("user_ip").value); text += "×tamp=" + encodeURIComponent(element("timestamp").value); text += "&domain=" + encodeURIComponent(element("domain").value); var complete = sendData(text); // if (complete) { goToStep3(); // } } function goToStep3(){ window.location = "redirect3.php"; } function GetXmlHttpObject() { var xmlHttp=null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your webbrowser does not support AJAX"); return false; } } } return xmlHttp; } function sendData(text) { xmlHttp=GetXmlHttpObject(); var url = 'http://xxxxxx.com/engine/directpost?'+text; xmlHttp.onreadystatechange = function() { if (xmlHttp.readyState == 4) { if (xmlHttp.status == 200) { return true; } else { return false; } } } xmlHttp.open('GET', url, true); xmlHttp.send(null); } THanks! I am trying to make this page work where new posts that get posted to it append smoothly on refresh instead of sliding up and down like they do now. Right now, you hit reply on your post and the entire thing goes up then unfolds again with the new post there, but the place is lost where you were on the paeg and you have to scroll down and I think that is not that user friendly. I want it to just pop or slide down under the existing posts so that the place on the window isn't lost for the user. The profile page is here. I am talking about the profile threads. It's a little bit like a facebook wall. If you need more info I will try and get it. Thank you in advance! Hello. Been searching all night for a way to do this, so thanks in advance for any help forthcoming. I'd like to be able to create a list of post titles that share the same tag in tumblr (rather than a list of tags). Tumblr allows you to filter your posts by tag by typing in a url, but this brings up a full page of posts, and I'd just like a list of the titles that I can then use as a menu. Hope this all makes sense. I'd imagine this is fairly simple as the capability to filter by tag already exists, but I cannot for the life of me work out how to do it. Thanks again. Hello everyone. I was hoping i could get some help from a php or a javascript pro. At the moment my site has been set up to load more posts in the same page instead of browsing 1,2,3..20 but there is a bit of a problem. After a few seconds of browsing a number pops up on my feed and shows the number of posts i have chosen to load in text format. Then all posts get reset back to 90 and i get scrolled back up to the top automatically. Could you please take a look at this php and javascript code and tell me what the problem is? $D->num_results = 0; $D->start_from = 0; $D->posts_html = ''; if( $q1!='' && $q2!='' ) { $D->num_results = $db2->fetch_field($q1); $D->start_from = $this->param('start_from') ? intval($this->param('start_from')) : 0; $D->start_from = max($D->start_from, 0); $D->start_from = min($D->start_from, $D->num_results); $res = $db2->query($q2.'LIMIT '.$D->start_from.', '.$C->PAGING_NUM_POSTS); $D->posts_number = 0; ob_start(); while($obj = $db2->fetch_object($res)) { $D->p = new post($obj->type, FALSE, $obj); if( $D->p->error ) { continue; } $D->posts_number ++; $D->p->list_index = $D->posts_number; $this->load_template('single_post.php'); } unset($D->p); $D->posts_html = ob_get_contents(); ob_end_clean(); } if( $this->param('from') == 'ajax' ) { echo 'OK:'.$D->posts_number.':'; $display echo $D->posts_html; die(); } if( $show=='all' || $show=='@me' || $show=='private' || $show=='commented' || $show=='feeds' ) { $this->network->reset_dashboard_tabstate($this->user->id, $show); } and my javascript function my_scroll_page_to(h) { if( document.body.scrollTop === undefined ) { w.scroll(0, h); return; } var start_scroll = parseInt( typeof(w.pageYOffset)=='number' ? w.pageYOffset : document.body.scrollTop, 10); if( isNaN( start_scroll ) ) { w.scroll(0, h); return; } if( start_scroll == h ) { return; } var step = start_scroll>h ? -12 : 12; var breakf = false; var func = function() { start_scroll += step; w.scroll(0, start_scroll); if( start_scroll == h ) { return; } if( step > 0 && start_scroll > h ) { return; } if( step < 0 && start_scroll < h ) { return; } if( breakf ) { return; } setTimeout( func, 1 ); } func(); document.body.addEventListener("orientationchange" , function(){ breakf = true; }, false); } function load_more_results(div_id, current_results, all_results) { current_results = parseInt(current_results, 10); all_results = parseInt(all_results, 10); var url = w.location.href.toString(); if( ! url ) { return; } if( url.substr(0, siteurl.length) == siteurl ) { url = url.substr(siteurl.length); if( url.indexOf("#") != -1 ) { url = url.substr(0, url.indexOf("#")); } url = siteurl+url+"/from:ajax/start_from:"+(current_results+1)+"/r:"+Math.round(Math.random()*1000); } else { url = url.replace(/^http(s)?\:\/\//, ""); url = url.substr(url.indexOf("/")); if( url.indexOf("#") != -1 ) { url = url.substr(0, url.indexOf("#")); } url = siteurl+url+"/from:ajax/r:"+Math.round(Math.random()*1000); } var req = ajax_init(false); if( ! req ) { return false; } req.onreadystatechange = function() { if( req.readyState != 4 ) { return; } var txt = trim(req.responseText); var num = txt.match(/^OK\[0-9]+)\:/g); if( ! num ) { return; } num = num.toString().match(/([0-9]+)/); num = parseInt(num, 10); if( ! num ) { return; } txt = txt.replace(/^OK\[0-9]+)\:/, ""); txt = trim(txt); var dv = document.createElement("DIV"); dv.innerHTML = txt; document.getElementById(div_id).appendChild(dv); setTimeout( function() { my_scroll_page_to(dv.offsetTop-30); }, 5); if( current_results+num+1 >= all_results ) { document.getElementById("loadmore").style.display = "block"; } document.getElementById("loadmorelink").onclick = function() { load_more_results(div_id, current_results+num+1, all_results); }; document.getElementById("loadmoreloader").style.di splay = "none"; } req.open("GET", url, true); req.send(""); document.getElementById("loadmoreloader").style.di splay = "block"; document.getElementById("loadmorelink").blur(); } I would really appreciate any with this issue as it makes my site look really ugly and we have a lot of members. Kind Regards Chan This post will contain a few guidelines for what you can do to get better help from us. Let's start with the obvious ones: - Use regular language. A spelling mistake or two isn't anything I'd complain about, but 1337-speak, all-lower-case-with-no-punctuation or huge amounts of run-in text in a single paragraph doesn't make it easier for us to help you. - Be verbose. We can't look in our crystal bowl and see the problem you have, so describe it in as much detail as possible. - Cut-and-paste the problem code. Don't retype it into the post, do a cut-and-paste of the actual production code. It's hard to debug code if we can't see it, and this way you make sure any spelling errors or such are caught and no new ones are introduced. - Post code within code tags, like this [code]your code here[/code]. This will display like so: Code: alert("This is some JavaScript code!") - Please, post the relevant code. If the code is large and complex, give us a link so we can see it in action, and just post snippets of it on the boards. - If the code is on an intranet or otherwise is not openly accessible, put it somewhere where we can access it. - Tell us any error messages from the JavaScript console in Firefox or Opera. (If you haven't tested it in those browsers, please do!) - If the code has both HTML/XML and JavaScript components, please show us both and not just part of it. - If the code has frames, iframes, objects, embeds, popups, XMLHttpRequest or similar components, tell us if you are trying it locally or from a server, and if the code is on the same or different servers. - We don't want to see the server side code in the form of PHP, PERL, ASP, JSP, ColdFusion or any other server side format. Show us the same code you send the browser. That is, show us the generated code, after the server has done it's thing. Generally, this is the code you see on a view-source in the browser, and specifically NOT the .php or .asp (or whatever) source code. |