Search Results

Search found 163 results on 7 pages for 'html4'.

Page 6/7 | < Previous Page | 2 3 4 5 6 7  | Next Page >

  • Need to write at beginning of file with PHP

    - by Timothy
    I'm making this program and I'm trying to find out how to write data to the beginning of a file rather than the end. "a"/append only writes to the end, how can I make it write to the beginning? Because "r+" does it but overwrites the previous data. $datab = fopen('database.txt', "r+"); Here is my whole file: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Facebook v0.1</title> <style type="text/css"> #bod{ margin:0 auto; width:800px; border:solid 2px black; } </style> </head> <body> <div id="bod"> <?php $fname = $_REQUEST['fname']; $lname = $_REQUEST['lname']; $comment = $_REQUEST['comment']; $datab = $_REQUEST['datab']; $gfile = $_REQUEST['gfile']; print <<<form <table border="2" style="margin:0 auto;"> <td> <form method="post" action=""> First Name : <input type ="text" name="fname" value=""> <br> Last Name : <input type ="text" name="lname" value=""> <br> Comment : <input type ="text" name="comment" value=""> <br> <input type ="submit" value="Submit"> </form> </td> </table> form; if((!empty($fname)) && (!empty($lname)) && (!empty($comment))){ $form = <<<come <table border='2' width='300px' style="margin:0 auto;"> <tr> <td> <span style="color:blue; font-weight:bold;"> $fname $lname : </span> $comment </td> </tr> </table> come; $datab = fopen('database.txt', "r+"); fputs($datab, $form); fclose($datab); }else if((empty($fname)) && (empty($lname)) && (empty($comment))){ print" please input data"; } // end table $datab = fopen('database.txt', "r"); while (!feof($datab)){ $gfile = fgets($datab); print "$gfile"; }// end of while ?> </div> </body> </html>

    Read the article

  • how can I exit from a php script and continue right after the script?

    - by Samir Ghobril
    Hey guys, I have this piece of code, and when I add return after echo(if there is an error and I need to continue right after the script) I can't see the footer, do you know what the problem is? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en" > <head> <title>Login | JM Today </title> <link href="Mainstyles.css" type="text/css" rel="stylesheet" /> </head> <body> <div class="container"> <?php include("header.php"); ?> <?php include("navbar.php"); ?> <?php include("cleanquery.php") ?> <div id="wrap"> <?php ini_set('display_errors', 'On'); error_reporting(E_ALL | E_STRICT); $conn=mysql_connect("localhost", "***", "***") or die(mysql_error()); mysql_select_db('jmtdy', $conn) or die(mysql_error()); if(isset($_POST['sublogin'])){ if(( strlen($_POST['user']) >0) && (strlen($_POST['pass']) >0)) { checklogin($_POST['user'], $_POST['pass']); } elseif((isset($_POST['user']) && empty($_POST['user'])) || (isset($_POST['pass']) && empty($_POST['pass']))){ echo '<p class="statusmsg">You didn\'t fill in the required fields.</p><br/><input type="button" value="Retry" onClick="location.href='."'login.php'\">"; return; } } else{ echo '<p class="statusmsg">You came here by mistake, didn\'t you?</p><br/><input type="button" value="Retry" onClick="location.href='."'login.php'\">"; return; } function checklogin($username, $password){ $username=mysql_real_escape_string($username); $password=mysql_real_escape_string($password); $result=mysql_query("select * from users where username = '$username'"); if($result != false){ $dbArray=mysql_fetch_array($result); $dbArray['password']=mysql_real_escape_string($dbArray['password']); $dbArray['username']=mysql_real_escape_string($dbArray['username']); if(($dbArray['password'] != $password ) || ($dbArray['username'] != $username)){ echo '<p class="statusmsg">The username or password you entered is incorrect. Please try again.</p><br/><input type="button" value="Retry" onClick="location.href='."'login.php'\">"; return; } $_SESSION['username']=$username; $_SESSION['password']=$password; if(isset($_POST['remember'])){ setcookie("jmuser",$_SESSION['username'],time()+60*60*24*356); setcookie("jmpass",$_SESSION['username'],time()+60*60*24*356); } } else{ echo'<p class="statusmsg"> The username or password you entered is incorrect. Please try again.</p><br/>input type="button" value="Retry" onClick="location.href='."'login.php'\">"; return; } } ?> </div> <br/> <br/> <?php include("footer.php") ?> </div> </body> </html>

    Read the article

  • can't implement jquery jScrollPane to replace browser's scrollbars

    - by Zack
    I am trying to replace browser's scrollbars with jScrollPane (jQuery), it won't work. Here are two attempts to implement it: a basic attempt, and an attempt to imitate the full page demo for jScrollPane. I've been trying everything I could think of to figure out what didn't work, but couldn't. here is my code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> <!-- styles needed by jScrollPane --> <link type="text/css" href="style/jquery.jscrollpane.css" rel="stylesheet" media="all" /> <style type="text/css" id="page-css"> /* Styles specific to this particular page */ html { overflow: auto; } #full-page-container { overflow: auto; } .scroll-pane { width: 100%; height: 200px; overflow: auto; } .horizontal-only { height: auto; max-height: 200px; } </style> <!-- latest jQuery direct from google's CDN --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <!-- the mousewheel plugin --> <script type="text/javascript" src="script/jquery.mousewheel.js"></script> <!-- the jScrollPane script --> <script type="text/javascript" src="script/jquery.jscrollpane.min.js"></script> <script type="text/javascript" id="sourcecode"> $(function () { var win = $(window); // Full body scroll var isResizing = false; win.bind( 'resize', function () { if (!isResizing) { isResizing = true; var container = $('#full-page-container'); // Temporarily make the container tiny so it doesn't influence the // calculation of the size of the document container.css( { 'width': 1, 'height': 1 } ); // Now make it the size of the window... container.css( { 'width': win.width(), 'height': win.height() } ); isResizing = false; container.jScrollPane( { 'showArrows': true } ); } } ).trigger('resize'); // Workaround for known Opera issue which breaks demo (see // http://jscrollpane.kelvinluck.com/known_issues.html#opera-scrollbar ) $('body').css('overflow', 'hidden'); // IE calculates the width incorrectly first time round (it // doesn't count the space used by the native scrollbar) so // we re-trigger if necessary. if ($('#full-page-container').width() != win.width()) { win.trigger('resize'); } }); </script> </head> <body> <div id="full-page-container"> This is the most basic implementation of jScrollPane I could create, if I am not wrong this has all it should take, yet it doesn't work. a little lorem ipsum to make the scrollbars show up: [here come's lot's of lorem ipsum text in the actual page...] </div> </body> </html> The other option is the same, with a link to demo.css and demo.js.

    Read the article

  • Facebook iFrame APP not working in IE, works on every other browser

    - by Sean Ashmore
    So im getting a blank page when loading this page within an iFrame on Internet explorer, every other browser works fine.. I have also tried using p3p headers as other people have suggested, but to no avail. <?php require ("connect.php"); require ("config.php"); require ("fb_config.php"); ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Login handler</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" href="css/login.css" type="text/css"> </head> <body> <?//=$user?> <?php if($user == 0) { echo "You are not logged into facebook. Nice try."; }else{ $query = "SELECT id,fb_id,login_ip,login_count,activated,sitestate FROM login WHERE fb_id='".mysql_real_escape_string($user)."'"; $result = mysql_query($query) or die(mysql_error()); $row = mysql_fetch_array($result); if (mysql_num_rows($result) == 0) { $sql = "INSERT INTO login SET id = '', fb_id ='" .mysql_real_escape_string($user). "', name = '" .rand(10000000000000000,99999999999999999999). "', signup =NOW() , password = '" .mysql_real_escape_string($pass). "', state = '0', mail = '" .mysql_real_escape_string($_POST['mail']). "',location='".mysql_real_escape_string($randomlocation)."',location_start='".mysql_real_escape_string($randomlocation)."', signup_ip='".mysql_real_escape_string($_SERVER['REMOTE_ADDR'])."',ref='".mysql_real_escape_string($_POST['ref'])."', activation_id = '" .mysql_real_escape_string($activation_link). "',activated='2', killprotection = '$twodayprot',gender='" .mysql_real_escape_string($_POST["gender"]). "'"; $res = mysql_query($sql); } //if($row['fb_id'] != $user){ //echo "Your facebook ID: $user is NOT in the MW DB."; //exit(); //}else{ if(empty($row['login_ip'])){ $row['login_ip'] = $_SERVER['REMOTE_ADDR']; }else{ $ip_information = explode("-", $row['login_ip']); if (in_array($_SERVER['REMOTE_ADDR'], $ip_information)) { $row['login_ip'] = $row['login_ip']; }else{ $row['login_ip'] = $row['login_ip']."-".$_SERVER['REMOTE_ADDR']; } } $update_login = mysql_query("UPDATE login SET login_count=login_count+'1' WHERE name='".mysql_real_escape_string($_POST['username'])."'") or die(mysql_error()); $_SESSION['user_id'] = $row['id']; $result = mysql_query("UPDATE login SET userip='".mysql_real_escape_string($_SERVER['REMOTE_ADDR'])."',login_ip='".mysql_real_escape_string($row['login_ip'])."',login_count='0' WHERE id='".mysql_real_escape_string($_SESSION['user_id'])."'") or die(mysql_error()); if ($row['sitestate'] == 0){ header("location: home.php"); } elseif ($row['sitestate'] == 2) { header("location: killed.php?id={$row['id']}&encrypted={$row['password']}"); } else { header("location: banned.php?id={$row['id']}&encrypted={$row['password']}"); } }// id check. ?> </body> </html>

    Read the article

  • Cart coding help

    - by user228390
    I've made a simple Javascript code for a shopping basket but now I have realised that I have made a error with making it and don't know how to fix it. What I have is Javascript file but I have also included the images source and the addtocart button as well, but What I am trying to do now is make 2 files one a .HTML file and another .JS file, but I can't get it to because when I make a button in the HTML file to call the function from the .JS file it won't work at all. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD><TITLE>shopping</TITLE> <META http-equiv=Content-Type content="text/html; charset=UTF-8"> <STYLE type=text/CSS> fieldset{width:300px} legend{font-size:24px;font-family:comic sans ms;color:#004455} </STYLE> <META content="MSHTML 6.00.2900.2963" name=GENERATOR></HEAD> <BODY scroll="auto"> <div id="products"></div><hr> <div id="inCart"></div> <SCRIPT type="text/javascript"> var items=['Xbox~149.99','StuffedGizmo~19.98','GadgetyGoop~9.97']; var M='?'; var product=[]; var price=[]; var stuff=''; function wpf(product,price){var pf='<form><FIELDSET><LEGEND>'+product+'</LEGEND>'; pf+='<img src="../images/'+product+'.jpg" alt="'+product+'" ><p>price '+M+''+price+'</p> <b>Qty</b><SELECT>'; for(i=0;i<6;i++){pf+='<option value="'+i+'">'+i+'</option>'} pf+='</SELECT>'; pf+='<input type="button" value="Add to cart" onclick="cart()" /></FIELDSET></form>'; return pf } for(j=0;j<items.length;j++){ product[j]=items[j].substring(0,items[j].indexOf('~')); price[j]=items[j].substring(items[j].indexOf('~')+1,items[j].length); stuff+=''+wpf(product[j],price[j])+''; } document.getElementById('products').innerHTML=stuff; function cart(){ var order=[]; var tot=0 for(o=0,k=0;o<document.forms.length;o++){ if(document.forms[o].elements[1].value!=0){ qnty=document.forms[o].elements[1].value; order[k]=''+product[o]+'_'+qnty+'*'+price[o]+''; tot+=qnty*price[o];k++ } } document.getElementById('inCart').innerHTML=order.join('<br>')+'<h3>Total '+tot+'</h3>'; } </SCRIPT> <input type="button" value="Add to cart" onclick="cart()" /></FIELDSET></form> </BODY></HTML>

    Read the article

  • input field placeholder in jQuery

    - by Hristo
    I'm trying to create a Login page, not worrying about actually logging in yet, but I'm trying to achieve the effect where there is some faded text inside the input field and when you click on it, the text disappears or if you click away the text reappears. I have this working for my "Username" input field, but the "Password" field is giving me problems because I can't just do $("#password").attr("type","password"). Here's my code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <!-- Links --> <link rel="stylesheet" type="text/css" href="style.css" /> <!-- Scripts --> <script type="text/javascript" src="jQuery.js"></script> <script> // document script $(document).ready(function(){ // login box event handler $('#login').click(function(){ $('.loginBox').animate({ height: '150px' }, '1000' ); $('#username').show(); // add pw placeholder field $('#password').after('<input type="text" id="placeHolder" value="Password" class="placeHolder" />'); $('#password').hide(); }); // username field focus and blur event handlers $('#username').focus(function() { if($(this).hasClass('placeHolder')){ $(this).val(''); $(this).removeClass('placeHolder'); } }); $('#username').blur(function() { if($(this).val() == '') { $(this).val('Username'); $(this).addClass('placeHolder'); } }); // password field focus and blur event handlers $('#placeHolder').focus(function() { $('#placeHolder').hide(); $('#password').show(); $('#password').focus(); }); $('#password').blur(function() { if($('#password').val() == '') { $('#placeHolder').show(); $('#password').hide(); } }); }); </script> </head> <body> <div id="loginBox" class="loginBox"> <a id="login">Proceed to Login</a><br /> <div id="loginForm"> <form> <input type="text" id="username" class="placeHolder" value="Username" /> <input type="password" id="password" class="placeHolder" value="" /> </form> </div> </div> </body> </html> Right now, I can click on the password input box and type in it, but the text is not disappearing and the "type" doesn't get set to "password"... the new input field I create isn't being hidden, it just stays visible, and I'm not sure where the problem is. Any ideas? Thanks, Hristo

    Read the article

  • IE7 rendering bug: Heading before a floated list

    - by Tomalak
    Can somebody please explain this IE7 bug to me? It occurs in Standards and Quirks mode rendering, it does not occur in Firefox, Chrome or IE8 (though switching the rendering engine via IE8 developer tools will provoke it). Here's the HTML to reproduce the behavior: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Test</title> <style type="text/css"> /* h1 { margin: 0px; } */ ul { padding: 0; margin: 0; list-style-type: none; } ul li { float: left; width: 140px; padding: 3px; } div { clear: left; padding: 3px; } div, li { background-color: OrangeRed; } /* ul { border: 1px solid blue; } */ </style> </head> <body> <h1>Heading 1</h1> <ul class="t"> <li>bla 1</li><li>bla 2</li><li>bla 3</li> </ul> <div>yada</div> </body> </html> This renders a floated <ul> above a <div> (supposed to be a tabbed user interface). There's an unexplained gap between the <div> and the <ul>. Now do one of the following: Uncomment the CSS rule for <h1>. The gap disappears and the list is rendered tight to the <div>, but also very close to the <h1>. Alternatively, uncomment the CSS rule for <ul>. Now a narrow blue border is rendered above the <ul>, but the gap disappears. My questions: How can the <h1> margin (I suppose any block level element with a defined margin will do) affect the space below the list? Can I prevent this from happening without having to set header margins to 0 or messing with the <ul> borders (setting border-width: 0; does not work BTW)? I suppose it is connected to the <ul> having no width because it has only floated children. Maybe someone with more insight into IE7 peculiarities than I have can explain what the rendering engine is doing here. Thanks!

    Read the article

  • Handling a Long Running jsp request on the server using Ajax and threads

    - by John Blue
    I am trying to implement a solution for a long running process on the server where it is taking about 10 min to process a pdf generation request. The browser bored/timesout at the 5 mins. I was thinking to deal with this using a Ajax and threads. I am using regular javascript for ajax. But I am stuck with it. I have reached till the point where it sends the request to the servlet and the servlet starts the thread.Please see the below code public class HelloServlet extends javax.servlet.http.HttpServlet implements javax.servlet.Servlet { protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { System.out.println("POST request!!"); LongProcess longProcess = new LongProcess(); longProcess.setDaemon(true); longProcess.start(); request.getSession().setAttribute("longProcess", longProcess); request.getRequestDispatcher("index.jsp").forward(request, response); } } class LongProcess extends Thread { public void run() { System.out.println("Thread Started!!"); while (progress < 10) { try { sleep(2000); } catch (InterruptedException ignore) {} progress++; } } } Here is my AJax call <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>My Title</title> <script language="JavaScript" > function getXMLObject() //XML OBJECT { var xmlHttp = false; xmlHttp = new XMLHttpRequest(); //For Mozilla, Opera Browsers return xmlHttp; // Mandatory Statement returning the ajax object created } var xmlhttp = new getXMLObject(); //xmlhttp holds the ajax object function ajaxFunction() { xmlhttp.open("GET","HelloServlet" ,true); xmlhttp.onreadystatechange = handleServerResponse; xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); xmlhttp.send(null); } function handleServerResponse() { if (xmlhttp.readyState == 4) { if(xmlhttp.status == 200) { document.forms[0].myDiv.value = xmlhttp.responseText; setTimeout(ajaxFunction(), 2000); } else { alert("Error during AJAX call. Please try again"); } } } function openPDF() { document.forms[0].method = "POST"; document.forms[0].action = "HelloServlet"; document.forms[0].submit(); } function stopAjax(){ clearInterval(intervalID); } </script> </head> <body><form name="myForm"> <table><tr><td> <INPUT TYPE="BUTTON" NAME="Download" VALUE="Download Queue ( PDF )" onclick="openPDF();"> </td></tr> <tr><td> Current status: <div id="myDiv"></div>% </td></tr></table> </form></body></html> But I dont know how to proceed further like how will the thread communicate the browser that the process has complete and how should the ajax call me made and check the status of the request. Please let me know if I am missing some pieces. Any suggestion if helpful.

    Read the article

  • Why ((Integer) weightModel.getObject()).intValue(); throws exception

    - by yakup
    I am learning Wicket by "Enjoying Web Development with Wicket" book. And in an example: int weight = ((Integer) weightModel.getObject()).intValue(); is used. When I click Submit button it throws exception. But after changed the code to: int weight=Integer.parseInt( (String) weightModel.getObject()); It works fine. What is the reason for throwing the exception? The full code: GetRequest.java package myapp.postage; import java.util.HashMap; import java.util.Map; import org.apache.wicket.markup.html.WebPage; import org.apache.wicket.markup.html.form.Form; import org.apache.wicket.markup.html.form.TextField; import org.apache.wicket.model.Model; @SuppressWarnings("unchecked") public class GetRequest extends WebPage { private Model weightModel=new Model(); private Model patronCodeModel=new Model(); private Map patronCodeToDiscount; public GetRequest(){ patronCodeToDiscount=new HashMap(); patronCodeToDiscount.put("p1", new Integer(90)); patronCodeToDiscount.put("p2", new Integer(95)); Form form=new Form("form"){ @Override protected void onSubmit(){ int weight = ((Integer) weightModel.getObject()).intValue(); Integer discount=(Integer)patronCodeToDiscount.get(patronCodeModel.getObject()); int postagePerKg=10; int postage=weight*postagePerKg; if(discount!=null){ postage=postage*discount.intValue()/100; } ShowPostage showPostage=new ShowPostage(postage); setResponsePage(showPostage); } }; TextField weight=new TextField("weight",weightModel); form.add(weight); TextField patronCode=new TextField("patronCode",patronCodeModel); form.add(patronCode); add(form); } } The html file GetRequest.html: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <form wicket:id="form"> <table> <tr> <td>Weight</td> <td><input type="text" wicket:id="weight"/></td> </tr> <tr> <td>Patron code:</td> <td><input type="text" wicket:id="patronCode"/></td> </tr> <tr> <td></td> <td><input type="submit"/></td> </tr> </table> </form> </html>

    Read the article

  • expanding/collapsing div using jQuery

    - by Hristo
    I'm trying to expand and collapse a <div> by clicking some text inside the <div>. The behavior right now is very odd. For example, if I click the text after the <div> is expanded... the <div> will collapse and then expand again. Also, if I click somewhere inside the div after it is expanded, it will collapse again, and I think that is because I'm triggering the animation since the <div> being animated is inside the wrapper <div>. Here's the code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <!-- Links --> <link rel="stylesheet" type="text/css" href="style.css" /> <!-- Scripts --> <script type="text/javascript" src="jQuery.js"></script> <script> // document script $(function(){ // login box event handler $('#login').click(function() { $('#loginBox').toggle( function() { $('.loginBox').animate({ height: '150px' }, '1000' ); $('#username').show(); $('#password').hide(); $('#placeHolder').show(); }, function() { $('.loginBox').animate({ height: '50px' }, '1000' ); $('#username').hide(); $('#password').hide(); $('#placeHolder').hide(); } ); }); // username field focus and blur event handlers $('#username').focus(function() { if($(this).hasClass('placeHolder')){ $(this).val(''); $(this).removeClass('placeHolder'); } }); $('#username').blur(function() { if($(this).val() == '') { $(this).val('Username'); $(this).addClass('placeHolder'); } }); // password field focus and blur event handlers $('#placeHolder').focus(function() { $(this).hide(); $('#password').show(); $('#password').focus(); $('#password').removeClass('placeHolder'); }); $('#password').blur(function() { if($(this).val() == '') { $('#placeHolder').show(); $(this).hide(); } }); }); </script> </head> <body> <div id="loginBox" class="loginBox"> <a id="login" class="login">Proceed to Login</a><br /> <div> <form> <input type="text" id="username" class="placeHolder" value="Username" /> <input type="password" id="password" class="placeHolder" value="" /> <input type="text" id="placeHolder" class="placeHolder" value="Password" /> </form> </div> </div> </body> </html> Any ideas? Thanks, Hristo

    Read the article

  • org.apache.struts2.dispatcher.Dispatcher: Could not find action or result Error

    - by peterwkc
    i tried to code the following simple struts but encounter this error during run time. [org.apache.struts2.dispatcher.Dispatcher] Could not find action or result: No result defined for action com.peter.action.LoginAction and result success index.jsp <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <%@ taglib prefix="s" uri="/struts-tags" %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Struts Tutorial</title> </head> <body> <h2>Hello Struts</h2> <s:form action="login" > <s:textfield name="username" label="Username:" /> <s:password name="password" label="Password:"/> <s:submit /> </s:form> </body> </html> LoginAction.java /** * */ package com.peter.action; //import org.apache.struts2.convention.annotation.Namespace; import org.apache.struts2.convention.annotation.ResultPath; import org.apache.struts2.convention.annotation.Result; import org.apache.struts2.convention.annotation.Action; import com.opensymphony.xwork2.ActionSupport; /** * @author nicholas_tse * */ //@Namespace("/") To define URL namespace @ResultPath("/") // To instruct Struts where to search result page(jsp) public class LoginAction extends ActionSupport { private String username, password; /** * */ private static final long serialVersionUID = -8992836566328180883L; /** * */ public LoginAction() { // TODO Auto-generated constructor stub } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } @Override @Action(value = "login", results = {@Result(name="success", location="welcome.jsp")}) public String execute() { return SUCCESS; } } /* Remove * struts2-gxp-plugin * struts2-portlet-plugin * struts2-jsf-plugin * struts2-osgi-plugin and its related osgi-plugin * struts-rest-plugin * * Add * velocity-tools-view * * */ web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app id="WebApp_ID" version="3.0" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"> <display-name>Struts</display-name> <!-- org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter org.apache.struts2.dispatcher.FilterDispatcher --> <filter> <filter-name>Struts_Filter</filter-name> <filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class> <init-param> <param-name>actionPackages</param-name> <param-value>com.peter.action</param-value> </init-param> </filter> <filter-mapping> <filter-name>Struts_Filter</filter-name> <url-pattern>/*</url-pattern> </filter-mapping> <listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class> </listener> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app> Besides the runtime error, there is deployment error which is ERROR [com.opensymphony.xwork2.util.finder.ClassFinder] (MSC service thread 1-2) Unable to read class [WEB-INF.classes.com.peter.action.LoginAction]: Could not load WEB-INF/classes/com/peter/action/LoginAction.class - [unknown location] at com.opensymphony.xwork2.util.finder.ClassFinder.readClassDef(ClassFinder.java:785) [xwork-core-2.3.1.2.jar:2.3.1.2] AFAIK, the scanning methodology of struts will scan the default packages named struts2 for any annotated class but i have instructed struts2 to scan in com.peter.action using init-param but still unable to find the class. It is pretty weird. Please help. Thanks.

    Read the article

  • Sending an Activation Email when a New User Registers

    - by John
    Hello, The code below is a login system that I am using. It is supposed to allow a new user to register and then send the new user an activation email. It is inserting the new user into the MySQL database, but it is not sending the activation email. Any ideas why it's not sending the activation email? Thanks in advance, John header.php: <?php //error_reporting(0); session_start(); require_once ('db_connect.inc.php'); require_once ("function.inc.php"); $seed="0dAfghRqSTgx"; $domain = "...com"; ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>The Sandbox - <?php echo $domain; ?></title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" type="text/css" href="sandbox.css"> <div class="hslogo"><a href="http://www...com/sandbox/"><img src="images/hslogo.png" alt="Example" border="0"/></a></div> </head> <body> login.php: <?php if (!isLoggedIn()) { // user is not logged in. if (isset($_POST['cmdlogin'])) { // retrieve the username and password sent from login form & check the login. if (checkLogin($_POST['username'], $_POST['password'])) { show_userbox(); } else { echo "Incorrect Login information !"; show_loginform(); } } else { // User is not logged in and has not pressed the login button // so we show him the loginform show_loginform(); } } else { // The user is already loggedin, so we show the userbox. show_userbox(); } ?> function show_loginform($disabled = false) { echo '<form name="login-form" id="login-form" method="post" action="./index.php?'.$_SERVER['QUERY_STRING'].'"> <div class="usernameformtext"><label title="Username">Username: </label></div> <div class="usernameformfield"><input tabindex="1" accesskey="u" name="username" type="text" maxlength="30" id="username" /></div> <div class="passwordformtext"><label title="Password">Password: </label></div> <div class="passwordformfield"><input tabindex="2" accesskey="p" name="password" type="password" maxlength="15" id="password" /></div> <div class="registertext"><a href="http://www...com/sandbox/register.php" title="Register">Register</a></div> <div class="lostpasswordtext"><a href="http://www...com/sandbox/lostpassword.php" title="Lost Password">Lost password?</a></div> <p class="loginbutton"><input tabindex="3" accesskey="l" type="submit" name="cmdlogin" value="Login" '; if ($disabled == true) { echo 'disabled="disabled"'; } echo ' /></p></form>'; } register.php: <?php require_once "header.php"; if (isset($_POST['register'])){ if (registerNewUser($_POST['username'], $_POST['password'], $_POST['password2'], $_POST['email'])){ echo "<div class='registration'>Thank you for registering, an email has been sent to your inbox, Please activate your account. <a href='http://www...com/sandbox/index.php'>Click here to login.</a> </div>"; }else { echo "Registration failed! Please try again."; show_registration_form(); } } else { // has not pressed the register button show_registration_form(); } ?> New User Function: function registerNewUser($username, $password, $password2, $email) { global $seed; if (!valid_username($username) || !valid_password($password) || !valid_email($email) || $password != $password2 || user_exists($username)) { return false; } $code = generate_code(20); $sql = sprintf("insert into login (username,password,email,actcode) value ('%s','%s','%s','%s')", mysql_real_escape_string($username), mysql_real_escape_string(sha1($password . $seed)) , mysql_real_escape_string($email), mysql_real_escape_string($code)); if (mysql_query($sql)) { $id = mysql_insert_id(); if (sendActivationEmail($username, $password, $id, $email, $code)) { return true; } else { return false; } } else { return false; } return false; } Send Activation Email function: function sendActivationEmail($username, $password, $uid, $email, $actcode) { global $domain; $link = "http://www.$domain/sandbox/activate.php?uid=$uid&actcode=$actcode"; $message = " Thank you for registering on http://www.$domain/, Your account information: username: $username password: $password Please click the link below to activate your account. $link Regards $domain Administration "; if (sendMail($email, "Please activate your account.", $message, "no-reply@$domain")) { return true; } else { return false; } }

    Read the article

  • Coloring even heighten columns

    - by verror
    I try to set different a background colors for left and right columns and to maintain the same height. So I set a background color for outer wrapper ("container" div) so it will set a color to rightBar. But this didn't work. Online Demo I want it to work on all browsers. Markup: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <title>Test</title> </head> <body> <div class="contentcontainer"> <div class="container"> <div class="mainBar"> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> <p>Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p> </div> <div class="rightBar"> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> <p>BAR Text BAR Text BAR Text</p> </div> </div> </div> </body> </html> CSS: body { font-family: Verdana,Tahoma,Arial, "Trebuchet MS" ,Sans-Serif,Georgia,Courier, "Times New Roman" ,Serif; margin: 0px; padding: 0px; background: repeat-x scroll center bottom #C4DAE9; text-align:center; } .contentcontainer { } .container { margin-left: auto; margin-right: auto; margin-top:5px; width: 99%; text-align: left; background-color:Gray; clear:both; } .mainBar { width:70%; float:left; background-color:White; } .rightBar { width:30%; float:left; }

    Read the article

  • Problems with Widgets in dojox DataGrid

    - by Kitson
    I am trying to include some editing Widgets in my dojox.grid.DataGrid seem to be having a lot of difficulty. I have tried everything I can think of to get it to work, but something just isn't going right. When I started having problems, I tried to copy almost exactly from the grid tests and model my "breakout" of code just like that, but without success. Basic editing of the Grid seems to work. In the example below, the "Events" column allows edits, but the two columns that are using the cellType attribute don't work. In fact they also seem to ignore the other attributes (like the styles) which would seem to indicate that some sort of issue was run into, but there is nothing in FireBug. Also I get the same behaviour between Chrome and Firefox. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Insert title here</title> <link id="themeStyles" rel="stylesheet" href="javascript/dojotoolkit/dijit/themes/tundra/tundra.css"> <style type="text/css"> @import "css/gctilog.css"; @import "javascript/dojotoolkit/dojo/resources/dojo.css"; @import "javascript/dojotoolkit/dijit/themes/tundra/tundra.css"; @import "javascript/dojotoolkit/dojox/grid/resources/Grid.css"; @import "javascript/dojotoolkit/dojox/grid/resources/tundraGrid.css"; @import "javascript/dojotoolkit/ocp/resources/MultiStateCheckBox.css"; </style> <script type="text/javascript" src="javascript/dojotoolkit/dojo/dojo.js" djConfig="parseOnLoad:true, isDebug:true, locale:'en-gb'"></script> <script type="text/javascript"> dojo.require("dojo.currency"); dojo.require("dijit.dijit"); dojo.require("dijit.form.HorizontalSlider"); dojo.require("dojox.data.JsonRestStore"); dojo.require("dojox.grid.DataGrid"); dojo.require("dojox.layout.ExpandoPane"); dojo.require("dojox.timing"); dojo.require("ocp.MultiStateCheckBox"); dojo.require("dojo.parser"); formatCurrency = function(inDatum){ return isNaN(inDatum) ? '...' : dojo.currency.format(inDatum, this.constraint); } </script> <script type="text/javascript" src="javascript/formatter.js"></script> <script type="text/javascript" src="javascript/utilities.js"></script> </head> <body class="tundra"> <div name="labelCallids">Call IDs</div> <div dojoType="dojox.data.JsonRestStore" id="callidStore4" jsId="callidStore4" target="logmap/maps.php/maps/4/callids/" idAttribute="callid"></div> <table dojoType="dojox.grid.DataGrid" id="callidGrid4" store="callidStore4" query="{ callid: '*' }" style="width: 950px; border: 1px solid rgb(0,156,221); margin-left: 15px;" clientSort="false" autoHeight="10" noDataMessage="No Call IDs Available..."> <thead> <tr> <th field="callid" width="375px">Call ID</th> <th cellType="dojox.grid.cells.ComboBox" field="type" options="SIP,TLib" editable="true" width="10em" styles='text-align: center;'>Type</th> <th field="event_count" width="40px" editable="true" styles="text-align: right;">Events</th> <th field="start_ts" width="75px" formatter="secToHourMinSecMS">Start</th> <th field="end_ts" width="75px" formatter="secToHourMinSecMS">End</th> <th field="duration" width="75px" formatter="secToHourMinSecMS">Duration</th> <th cellType="dojox.grid.cells._Widget" widgetClass="dijit.form.HorizontalSlider" field="include" formatter="formatCurrency" constraint="{currency:'EUR'}" editable="true" width="10em" styles='text-align: right;'>Amount</th> </tr> </thead> </table> </body> </html> Is there anything that I am missing. It would seem to be fundamental, but I just can't seem to see it. [EDIT] What I have done instead is return a dijit Widget using the formatter to return a widget. So in the declarative model, I specify something like this: <th field="type" formatter="getMultiField" width="10em" styles='text-align: center;'>Type</th> And then I wrote a JavaScript function like the below to return the widget I wanted. function getMultiField(value) { var jsonValue = JSON.parse(value); //I provide the value of the widget as JSON //from my data store, so I need to parse it var control = new ocp.MultiStateCheckBox({ //my custom widget id : "dMSCB"+(new Date).getTime()+Math.ceil(Math.random()*100000), //generate a unique ID value : jsonValue.value, onChange : function (value {...}) //code to manipulate the underlying data store }); return control; //The dojo 1.4 grid can handle a returned Widget }

    Read the article

  • how to integrate jquery with jsf richfaces tags for print the image and textarea content?

    - by eswaramoorthy-nec
    hi, Here i write code to take printout the textarea content using jquery. I load the two java script (jquery-1.3.2.js and jquery.print.js) But these two source file not support rich:datascroller tag.. That means there is no reaction in datascroller. I need to take print the textarea content and also perfectly work to datascroller also. Here i give jsp and related java files. This code have datatable, rich:datascroller and textarea. Datatable for only used for test the datascroller component. My focus : print the textarea content as well as perfectly work to datascroller component. printer.jsp <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%> <%@ taglib uri="http://richfaces.org/rich" prefix="rich"%> <html> <head> <title>Print Viewer </title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <a4j:loadScript src="resource/jquery-1.3.2.js"/> <a4j:loadScript src="resource/jquery.print.js"/> // The problem is : above two loadscript does not support datascroller //componenet. // But that two jquery file for using to take the print. <script type="text/javascript"> function printData() { //Print the Div content for textarea jQuery( ".printable" ).print(); return( false ); } </script> </head> <body> <h:form id="printViewerForm" binding="#{PrintViewer.initForm}"> <rich:panel id="printViewerRichPanel"> <h:panelGrid cellpadding="3" columns="2" id="printPanelGridId" cellspacing="3" border ="1"> <h:panelGrid> //DataScroller for dataTable <rich:datascroller id = "dataScrollerTop" align="center" for= "printDataTable" page="1" maxPages="20"/> <rich:dataTable id="printDataTable" value="#{PrintViewer.printViewerList}" cellpadding="3" rows = "5" rowKeyVar="rowIndex" cellspacing="3" var="printViewerResultListTo"> <f:facet name="header"> <rich:columnGroup> <rich:column> <h:outputText value="PrintTable"/> </rich:column> </rich:columnGroup> </f:facet> <rich:column> <h:outputText value="#{printViewerResultListTo.printName}"/> </rich:column> </rich:dataTable> </h:panelGrid> //Print Content Region <a4j:region id="printContentViewRegion"> <a4j:commandButton id="printButton" value="PrintContent" onclick="printData()"/> <div id="printContentDiv" class="printable"> <h:inputTextarea id="printContentTextArea" style="width:300px;height:300px; value =" This is Sample Jquery For Test working Text Area"/> </div> </a4j:region> </h:panelGrid> </rich:panel> </h:form> </body> PrintViewer.java import java.util.ArrayList; import java.util.List; import javax.faces.component.html.HtmlForm; public class PrintViewer { private HtmlForm initForm; private List printViewerList = new ArrayList(); public HtmlForm getInitForm() { printViewerList = getPrintList(); return initForm; } private List getUploadList() { if (!printViewerList.isEmpty()) { printViewerList.clear(); } printViewerList.add(new PrintViewerResultListTo("print 1")); printViewerList.add(new PrintViewerResultListTo("print 2")); printViewerList.add(new PrintViewerResultListTo("print 3")); printViewerList.add(new PrintViewerResultListTo("print 4")); printViewerList.add(new PrintViewerResultListTo("print 5")); printViewerList.add(new PrintViewerResultListTo("print 6")); printViewerList.add(new PrintViewerResultListTo("print 7")); printViewerList.add(new PrintViewerResultListTo("print 8")); printViewerList.add(new PrintViewerResultListTo("print 9")); printViewerList.add(new PrintViewerResultListTo("print 10")); printViewerList.add(new PrintViewerResultListTo("print 11")); printViewerList.add(new PrintViewerResultListTo("print 12")); printViewerList.add(new PrintViewerResultListTo("print 13")); printViewerList.add(new PrintViewerResultListTo("print 14")); printViewerList.add(new PrintViewerResultListTo("print 15")); return printViewerList; } public void setInitForm(HtmlForm initForm) { this.initForm = initForm; } public List getPrintViewerList() { return printViewerList; } public void setPrintViewerList(List printViewerList) { this.printViewerList = printViewerList; } } PrintViewerResultListTo.java public class PrintViewerResultListTo { private String printName; PrintViewerResultListTo(String printName) { this.printName = printName; } public String getPrintName() { return printName; } public void setPrintName(String printName) { this.printName = printName; } } I hope help me about this. Thanks in advance.

    Read the article

  • "Phased" execution of functions in javascript

    - by FK82
    Hey there! This is my first post on stackoverflow, so please don't flame me too hard if I come across like a total nitwit or if I'm unable ot make myself perfectly clear. :-) Here's my problem: I'm trying to write a javascript function that "ties" two functions to another by checking the first one's completion and then executing the second one. The easy solution to this obviously would be to write a meta function that calls both functions within it's scope. However, if the first function is asynchronous (specifically an AJAX call) and the second function requires the first one's result data, that simply won't work. My idea for a solution was to give the first function a "flag", i.e. making it create a public property "this.trigger" (initialized as "0", set to "1" upon completion) once it is called; doing that should make it possible for another function to check the flag for its value ([0,1]). If the condition is met ("trigger == 1") the second function should get called. The following is an abstract example code that I have used for testing: <script type="text/javascript" > /**/function cllFnc(tgt) { //!! first function this.trigger = 0 ; var trigger = this.trigger ; var _tgt = document.getElementById(tgt) ; //!! changes the color of the target div to signalize the function's execution _tgt.style.background = '#66f' ; alert('Calling! ...') ; setTimeout(function() { //!! in place of an AJAX call, duration 5000ms trigger = 1 ; },5000) ; } /**/function rcvFnc(tgt) { //!! second function that should get called upon the first function's completion var _tgt = document.getElementById(tgt) ; //!! changes color of the target div to signalize the function's execution _tgt.style.background = '#f63' ; alert('... Someone picked up!') ; } /**/function callCheck(obj) { //alert(obj.trigger ) ; //!! correctly returns initial "0" if(obj.trigger == 1) { //!! here's the problem: trigger never receives change from function on success and thus function two never fires alert('trigger is one') ; return true ; } else if(obj.trigger == 0) { return false ; } } /**/function tieExc(fncA,fncB,prms) { if(fncA == 'cllFnc') { var objA = new cllFnc(prms) ; alert(typeof objA + '\n' + objA.trigger) ; //!! returns expected values "object" and "0" } //room for more case definitions var myItv = window.setInterval(function() { document.getElementById(prms).innerHTML = new Date() ; //!! displays date in target div to signalize the interval increments var myCallCheck = new callCheck(objA) ; if( myCallCheck == true ) { if(fncB == 'rcvFnc') { var objB = new rcvFnc(prms) ; } //room for more case definitions window.clearInterval(myItv) ; } else if( myCallCheck == false ) { return ; } },500) ; } </script> The HTML part for testing: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd > <html> <head> <script type="text/javascript" > <!-- see above --> </script> <title> Test page </title> </head> <body> <!-- !! testing area --> <div id='target' style='float:left ; height:6em ; width:8em ; padding:0.1em 0 0 0; font-size:5em ; text-align:center ; font-weight:bold ; color:#eee ; background:#fff;border:0.1em solid #555 ; -webkit-border-radius:0.5em ;' > Test Div </div> <div style="float:left;" > <input type="button" value="tie calls" onmousedown="tieExc('cllFnc','rcvFnc','target') ;" /> </div> <body> </html> I'm pretty sure that this is some issue with javascript scope as I have checked whether the trigger gets set to "1" correctly and it does. Very likely the "checkCall()" function does not receive the updated object but instead only checks its old instance which obviously never flags completion by setting "this.trigger" to "1". If so I don't know how to address that issue. Anyway, hope someone has an idea or experience with this particular kind of problem. Thanks for reading! FK

    Read the article

  • AJAX call + JQuery Dialog Title changing dynamically

    - by Panther24
    I have an AJAX call which loads an Dialog page, now depending upon the content of the data returned on the AJAX call, I want to change the title of the Window, how do I do that. Here is the snippet of code: var divid = "brHistoryForm"; var url = "getRestoreFiles.action?profileName="+profileName; // Create xmlHttp var xmlHttp = AJAX(); // The code... xmlHttp.onreadystatechange=function(){ if(xmlHttp.readyState==4){ document.getElementById(divid).innerHTML=xmlHttp.responseText; } } xmlHttp.open("GET",url,true); xmlHttp.send(null); $('#brHistoryForm').dialog('open'); jQuery('#brHistoryForm').focus(); document.getElementById('pageTitle').innerHTML = "<h2>"+profileName+" - B&R History</h2>" Here 'pageTitle' is a div. When I run the above piece of code, it opens a dialog window, the action is redirected to a jsp page which is loaded inside the div. It works fine, but the title does not get set :(. I've tried to do the setting of the title in the redirected jsp page, it doesn't work either. Here is the code of that JSP page: <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@ taglib prefix="s" uri="/struts-tags" %> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>B&R History</title> </head> <body> <table style="width: 100%"> <tr> <td style="width: 40%"> <div id="pageTitle"> <h2>B&R History</h2> </div> </td> </tr> </table> <table id="diskTable" cellpadding="0" cellspacing="0" border="1" class="display"> <thead> <tr> <th>Select</th><th>Operation</th> <th>Source</th><th>Destination</th> <th>Status</th><th>Start Time</th><th>End Time</th> </tr> </thead> <tfoot></tfoot> <tbody> <s:iterator value="restoreFileList"> <tr> <td> <s:if test="%{status.equals('Finished')}"> <input onClick="loadRestoreForm('<s:property value="name"/>', '<s:property value="to_path"/>', '<s:property value="status"/>')" type="radio" name='chk' id="chk" value="<s:property value='id'/>,<s:property value="status"/>" > </s:if> <s:else> <input type="radio" name='chk' id="chk" value="<s:property value='id'/>,<s:property value="status"/>" disabled> </s:else> </td> <td> <s:if test="%{br_type == 0}"> Backup </s:if> <s:else> Restore </s:else> </td> <td><s:property value="from_path"/></td> <td><s:property value="to_path"/></td> <td><s:property value="status"/></td> <td><s:property value="start_time"/></td> <td><s:property value="end_time"/></td> </tr> </s:iterator> </tbody> </table> </body> </html> Any help would be appreciated.

    Read the article

  • JavaScript snippet that populates the table

    - by kayn
    I would like to write a JavaScript snippet that populates the table based on the selection, and not create several details panes and toggle their visibility. I tried implement this using the following code but its not working as desired,firstly,it only works with internet explorer under certain conditions and it just toggles visibility of detail panes;Below is my code; <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> </HEAD> <BODY onLoad="tblTB_0.style.display='';tblTB_1.style.display='none'; tblTB_2.style.display='none'; tblTB_3.style.display='none'"> <center> <table> <tr> <td> <H1> <align="left"> Candi Colledge of Computing <br/>Course Page </H1> </td> </tr> </table> </center> <hr> </br> <H2><P STYLE="color: blue">Honours Courses.</H2> <left> <p><a href="" onclick="tblTB_1.style.display=''; tblTB_2.style.display='none'; tblTB_3.style.display='none'"> Concurrent Programming</a> <br/> <a href="" onclick="tblTB_1.style.display='none';tblTB_2.style.display=''; tblTB_3.style.display='none'">Simulation of Networks</a><br/> <a href="" onclick="tblTB_1.style.display='none';tblTB_2.style.display='none'; tblTB_3.style.display=''">Advanced Computer Science Topics</a></p> <br> <table style="table-layout: fixed"; border=1> <colgroup> <col width="100px"><col width="150px"><col width="150px"> </colgroup> <tbody id="tblTB_0"> <tr> <td>Course Code</td> <td>Lecturer</td> <td>Hours/Week</td> <td>Credits</td> </tr> </tbody> <tbody id="tblTB_1"> <tr> <td>RW 714</td> <td>Dr. kate</td> <td>2 hrs</td> <td>15</td </tr> </tbody> <tbody id="tblTB_2"> <tr> <td>RW 742</td> <td>Prof. Broz</td> <td>4 hrs</td> <td>10</td> </tr> </tbody> <tbody id="tblTB_3"> <tr> <td>RW 716</td> <td>Consultant</td> <td>3 hrs</td> <td>12</td> </tr> </tbody> </table> </left> <br> </BODY> </HTML>

    Read the article

  • Json / Jsonp not connecting to php (Phonegap + jquerymobile)

    - by Madhulika Mukherjee
    I am trying to make - an android WEB application with phonegap layout with JqueryMobile What Im doing - An html form that takes ID, name, and address as input 'Serialize's this data using ajax makes a json object out of it Should send it to a file called 'connection.php' Where, this data is put into a database (MySql) Other details - My server is localhost, Im using xampp I have already created a database and table using phpmyadmin The problem - My html file, where my json object is created, does not connect to the php file which is hosted by my localhost Here is my COMPLETE html file: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <!-- Change this if you want to allow scaling --> <meta name="viewport" content="width=default-width; user-scalable=no" /> <meta http-equiv="Content-type" content="text/html;charset=utf-8"> <title>Trial app</title> <link rel="stylesheet" href="thestylesheet.css" type="text/css"> <script type="text/javascript" charset="utf-8" src="javascript1.js"></script> <script type="text/javascript" charset="utf-8" src="javascript2.js"></script> <script type="text/javascript" charset="utf-8" src="cordova-1.8.0.js"></script> <script> $(document).ready(function () { $("#btn").click( function() { alert('hello hello'); $.ajax({ url: "connection.php", type: "POST", data: { id: $('#id').val(), name: $('#name').val(), Address: $('#Address').val() }, datatype: "json", success: function (status) { if (status.success == false) { alert("Failure!"); } else { alert("Success!"); } } }); }); }); </script> </head> <body> <div data-role="header"> <h1>Heading of the app</h1> </div><!-- /header --> <div data-role="content"> <form id="target" method="post"> <label for="id"> <input type="text" id="id" placeholder="ID"> </label> <label for="name"> <input type="text" id="name" placeholder="Name"> </label> <label for="Address"> <input type="text" id="Address" placeholder="Address"> </label> <div id="btn" data-role="button" data-icon="star" data-theme="e">Add record</div> <!--<input type="submit" value="Add record" data-icon="star" data-theme="e"> --> </form> </div> </body> </html> And here is my 'connection.php' hosted by my localhost <?php header('Content-type: application/json'); $server = "localhost"; $username = "root"; $password = ""; $database = "jqueryex"; $con = mysql_connect($server, $username, $password); if($con) { echo "Connected to database!"; } else { echo "Could not connect!"; } //or die ("Could not connect: " . mysql_error()); mysql_select_db($database, $con); /* CREATE TABLE `sample` ( `id` int(11) unsigned NOT NULL AUTO_INCREMENT, `name` varchar(45) DEFAULT NULL, `Address` varchar(45) DEFAULT NULL, PRIMARY KEY (`id`) ) */ $id= json_decode($_POST['id']); $name = json_decode($_POST['name']); $Address = json_decode($_POST['Address']); $sql = "INSERT INTO sample (id, name, Address) "; $sql .= "VALUES ($id, '$name', '$Address')"; if (!mysql_query($sql, $con)) { die('Error: ' . mysql_error()); } else { echo "Comment added"; } mysql_close($con); ?> My doubts: No entry is made in my table 'sample' when i view it in phpmyadmin So obviously, i see no success messages either I dont get any errors, not from ajax and neither from the php file. Stuff Im suspecting: Should i be using jsonp instead of json? Im new to this. Is there a problem with my php file? Perhaps I need to include some more javascript files in my html file? I assume this is a very simple problem so please help me out! I think there is just some conceptual error, as i have only just started with jquery, ajax, and json. Thank you.

    Read the article

  • Get Checked RadioButtons using JavaScript

    - by Rudi
    so I’m trying to build a win 8 app, which includes a WebView. The WebView contains the HTML code (+JavaScript) below. <!DOCTYPE HTML PUBLIC " -//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <?xml version='1.0' encoding='UTF-8' standalone='yes'?> <html> <head> <meta http-equiv='Content-Type' content='text/html; charset=utf-8' > <script type='text/javascript'> function get_radio_value() { for (var i=0; i < document.myForm.frage1.length; i++) { if (document.orderform.frage1[i].checked) { var rad_val = document.myForm.frage1[i].value; return rad_val; } } } </script> <title>Kundenfragebogen</title> </head> <body> <h1>Kundenfragebogen</h1> <div id='myDiv'>Hello</div> <form name='myForm' action=''> <table border='2'> <tr> <td></td> <td>sehr gut</td> <td>gut</td> <td>schlecht</td> </tr> <tr> <td>Wie geht es Ihnen?</td> <td><input type='radio' name="frage1" value='1'/>Mir ging es noch nie besser!</td> <td><input type='radio' name="frage1" value='2'/>Es geht mir so wie immer.</td> <td><input type='radio' name="frage1" value='3'/>Heute geht einfach gar nichts…</td> </tr> <tr> <td>Können Sie Auto fahren?</td> <td><input type='radio' name="frage2" value='1'/>Ja</td> <td></td> <td><input type='radio' name="frage2" value='3'/>Nein</td> </tr> <tr> <td>Möchten Sie unseren Newsletter abonnieren?</td> <td><input type='radio' name="frage3" value='1'/>Ja</td> <td></td> <td></td> </tr> </table> <input type='button' value='Formular absenden' onclick="return get_radio_value()"/> </form> </body> </html> So the html contains some radio buttons and a button. I’ve used JavaScript ~2 years ago (just a little), so I don’t really know how to write the exact code. I’ve found something on the internet, but it doesn’t do what I want. I want to have the following: The user can check the RadioButtons. When the user clicks the Button, the JavaScript function should return all the checked radio buttons (I only need to know which RadioButton is checked). Since I know the name of the RadioButtons in my Windows 8 App, I can do the following: var object = WebView.InvokeScript("JavaScriptFunctionNAME", NameOfRadiobutton); So the WebView invokes the script and should get as a return the VALUE of the RadioButton, which is checked. “JavaScriptFunctionNAME” = name of the function in Javascript NameOfRadiobutton = the name of the RadioButton as a parameter (for example “frage1”). Currently I’m returning the value of the radiobutton, which is checked in the RadioGroup “frage1”. How can I check every RadioButton by it’s parameter? By this I mean I have a parameter “frage1” and return the value of the checked RadioButton. After this, I call the function again with the parameter “frage2” and return the checked RadioButtons value. Could anyone help me out with the JavaScript-function?

    Read the article

  • tables wrapping to next line when width 100%

    - by jmo
    I'm encountering some weirdness with tables in css. The layout is fairly simple, a fixed-width nav bar on the left and the content on the right. When the content includes a table with a width of 100% the table ends up getting pushed down until it has room to take up the full width of the screen (instead of just the area to the right of the nav bar). If I remove the width=100% from the table's css, then it looks fine, but obviously the table doesn't grow to fill the space of the div. The problem is that i want the table to grow and shrink with the window but still stay in the bounds of its div. Thanks. Here's a simple example: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Test</title> <style type="text/css"> #content { padding-right:20px; background:white; overflow:hidden; margin:20px; } #content .column { position:relative; padding-bottom: 20010px; margin-bottom: -20000px; } #center { width:100%; padding-top:15px; } body { min-width:700px; } #left { width: 330px; padding: 0 10px; padding-top:10px; float:left; } .tableData { width:100%; } </style> </head> <body> <div id="content"> <div class="column" id="left"> <div> Some text goes in here<br/> some more text<br/> some more text<br/> some more text<br/> some more text<br/> some more text<br/> </div> </div> <div class="column" id="center"> Some text at the top; <hr/> <table class="tableData"> <thead> <tr><th>A</th><th>B</th><th>C</th></tr> </thead> <tbody> <tr> <td>A1 A1 A1 A1</td> <td>B1 B1 B1 B1</td> <td>C1 C1 C1 C1 C</td> </tr> <tr> <td>A2 A2 A2 A2 </td> <td>B2 B2 B2 B2 </td> <td>C2 C2 C2 C2</td> </tr> <tr> <td>A3 A3 A3 A3 A3 </td> <td>B3 B3 B3 B3 B3 </td> <td>C3 C3 C3 C3 C3</td> </tr> <tr> <td>A4 A4 A4 A4 A4</td> <td>B4 B4 B4 B4 B4</td> <td>C4 C4 C4 C4 C4</td> </tr> </tbody> </table> </div> </div> </body> </html>

    Read the article

  • Integrating JavaScript Unit Tests with Visual Studio

    - by Stephen Walther
    Modern ASP.NET web applications take full advantage of client-side JavaScript to provide better interactivity and responsiveness. If you are building an ASP.NET application in the right way, you quickly end up with lots and lots of JavaScript code. When writing server code, you should be writing unit tests. One big advantage of unit tests is that they provide you with a safety net that enable you to safely modify your existing code – for example, fix bugs, add new features, and make performance enhancements -- without breaking your existing code. Every time you modify your code, you can execute your unit tests to verify that you have not broken anything. For the same reason that you should write unit tests for your server code, you should write unit tests for your client code. JavaScript is just as susceptible to bugs as C#. There is no shortage of unit testing frameworks for JavaScript. Each of the major JavaScript libraries has its own unit testing framework. For example, jQuery has QUnit, Prototype has UnitTestJS, YUI has YUI Test, and Dojo has Dojo Objective Harness (DOH). The challenge is integrating a JavaScript unit testing framework with Visual Studio. Visual Studio and Visual Studio ALM provide fantastic support for server-side unit tests. You can easily view the results of running your unit tests in the Visual Studio Test Results window. You can set up a check-in policy which requires that all unit tests pass before your source code can be committed to the source code repository. In addition, you can set up Team Build to execute your unit tests automatically. Unfortunately, Visual Studio does not provide “out-of-the-box” support for JavaScript unit tests. MS Test, the unit testing framework included in Visual Studio, does not support JavaScript unit tests. As soon as you leave the server world, you are left on your own. The goal of this blog entry is to describe one approach to integrating JavaScript unit tests with MS Test so that you can execute your JavaScript unit tests side-by-side with your C# unit tests. The goal is to enable you to execute JavaScript unit tests in exactly the same way as server-side unit tests. You can download the source code described by this project by scrolling to the end of this blog entry. Rejected Approach: Browser Launchers One popular approach to executing JavaScript unit tests is to use a browser as a test-driver. When you use a browser as a test-driver, you open up a browser window to execute and view the results of executing your JavaScript unit tests. For example, QUnit – the unit testing framework for jQuery – takes this approach. The following HTML page illustrates how you can use QUnit to create a unit test for a function named addNumbers(). <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Using QUnit</title> <link rel="stylesheet" href="http://github.com/jquery/qunit/raw/master/qunit/qunit.css" type="text/css" /> </head> <body> <h1 id="qunit-header">QUnit example</h1> <h2 id="qunit-banner"></h2> <div id="qunit-testrunner-toolbar"></div> <h2 id="qunit-userAgent"></h2> <ol id="qunit-tests"></ol> <div id="qunit-fixture">test markup, will be hidden</div> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript" src="http://github.com/jquery/qunit/raw/master/qunit/qunit.js"></script> <script type="text/javascript"> // The function to test function addNumbers(a, b) { return a+b; } // The unit test test("Test of addNumbers", function () { equals(4, addNumbers(1,3), "1+3 should be 4"); }); </script> </body> </html> This test verifies that calling addNumbers(1,3) returns the expected value 4. When you open this page in a browser, you can see that this test does, in fact, pass. The idea is that you can quickly refresh this QUnit HTML JavaScript test driver page in your browser whenever you modify your JavaScript code. In other words, you can keep a browser window open and keep refreshing it over and over while you are developing your application. That way, you can know very quickly whenever you have broken your JavaScript code. While easy to setup, there are several big disadvantages to this approach to executing JavaScript unit tests: You must view your JavaScript unit test results in a different location than your server unit test results. The JavaScript unit test results appear in the browser and the server unit test results appear in the Visual Studio Test Results window. Because all of your unit test results don’t appear in a single location, you are more likely to introduce bugs into your code without noticing it. Because your unit tests are not integrated with Visual Studio – in particular, MS Test -- you cannot easily include your JavaScript unit tests when setting up check-in policies or when performing automated builds with Team Build. A more sophisticated approach to using a browser as a test-driver is to automate the web browser. Instead of launching the browser and loading the test code yourself, you use a framework to automate this process. There are several different testing frameworks that support this approach: · Selenium – Selenium is a very powerful framework for automating browser tests. You can create your tests by recording a Firefox session or by writing the test driver code in server code such as C#. You can learn more about Selenium at http://seleniumhq.org/. LTAF – The ASP.NET team uses the Lightweight Test Automation Framework to test JavaScript code in the ASP.NET framework. You can learn more about LTAF by visiting the project home at CodePlex: http://aspnet.codeplex.com/releases/view/35501 jsTestDriver – This framework uses Java to automate the browser. jsTestDriver creates a server which can be used to automate multiple browsers simultaneously. This project is located at http://code.google.com/p/js-test-driver/ TestSwam – This framework, created by John Resig, uses PHP to automate the browser. Like jsTestDriver, the framework creates a test server. You can open multiple browsers that are automated by the test server. Learn more about TestSwarm by visiting the following address: https://github.com/jeresig/testswarm/wiki Yeti – This is the framework introduced by Yahoo for automating browser tests. Yeti uses server-side JavaScript and depends on Node.js. Learn more about Yeti at http://www.yuiblog.com/blog/2010/08/25/introducing-yeti-the-yui-easy-testing-interface/ All of these frameworks are great for integration tests – however, they are not the best frameworks to use for unit tests. In one way or another, all of these frameworks depend on executing tests within the context of a “living and breathing” browser. If you create an ASP.NET Unit Test then Visual Studio will launch a web server before executing the unit test. Why is launching a web server so bad? It is not the worst thing in the world. However, it does introduce dependencies that prevent your code from being tested in isolation. One of the defining features of a unit test -- versus an integration test – is that a unit test tests code in isolation. Another problem with launching a web server when performing unit tests is that launching a web server can be slow. If you cannot execute your unit tests quickly, you are less likely to execute your unit tests each and every time you make a code change. You are much more likely to fall into the pit of failure. Launching a browser when performing a JavaScript unit test has all of the same disadvantages as launching a web server when performing an ASP.NET unit test. Instead of testing a unit of JavaScript code in isolation, you are testing JavaScript code within the context of a particular browser. Using the frameworks listed above for integration tests makes perfect sense. However, I want to consider a different approach for creating unit tests for JavaScript code. Using Server-Side JavaScript for JavaScript Unit Tests A completely different approach to executing JavaScript unit tests is to perform the tests outside of any browser. If you really want to test JavaScript then you should test JavaScript and leave the browser out of the testing process. There are several ways that you can execute JavaScript on the server outside the context of any browser: Rhino – Rhino is an implementation of JavaScript written in Java. The Rhino project is maintained by the Mozilla project. Learn more about Rhino at http://www.mozilla.org/rhino/ V8 – V8 is the open-source Google JavaScript engine written in C++. This is the JavaScript engine used by the Chrome web browser. You can download V8 and embed it in your project by visiting http://code.google.com/p/v8/ JScript – JScript is the JavaScript Script Engine used by Internet Explorer (up to but not including Internet Explorer 9), Windows Script Host, and Active Server Pages. Internet Explorer is still the most popular web browser. Therefore, I decided to focus on using the JScript Script Engine to execute JavaScript unit tests. Using the Microsoft Script Control There are two basic ways that you can pass JavaScript to the JScript Script Engine and execute the code: use the Microsoft Windows Script Interfaces or use the Microsoft Script Control. The difficult and proper way to execute JavaScript using the JScript Script Engine is to use the Microsoft Windows Script Interfaces. You can learn more about the Script Interfaces by visiting http://msdn.microsoft.com/en-us/library/t9d4xf28(VS.85).aspx The main disadvantage of using the Script Interfaces is that they are difficult to use from .NET. There is a great series of articles on using the Script Interfaces from C# located at http://www.drdobbs.com/184406028. I picked the easier alternative and used the Microsoft Script Control. The Microsoft Script Control is an ActiveX control that provides a higher level abstraction over the Window Script Interfaces. You can download the Microsoft Script Control from here: http://www.microsoft.com/downloads/en/details.aspx?FamilyID=d7e31492-2595-49e6-8c02-1426fec693ac After you download the Microsoft Script Control, you need to add a reference to it to your project. Select the Visual Studio menu option Project, Add Reference to open the Add Reference dialog. Select the COM tab and add the Microsoft Script Control 1.0. Using the Script Control is easy. You call the Script Control AddCode() method to add JavaScript code to the Script Engine. Next, you call the Script Control Run() method to run a particular JavaScript function. The reference documentation for the Microsoft Script Control is located at the MSDN website: http://msdn.microsoft.com/en-us/library/aa227633%28v=vs.60%29.aspx Creating the JavaScript Code to Test To keep things simple, let’s imagine that you want to test the following JavaScript function named addNumbers() which simply adds two numbers together: MvcApplication1\Scripts\Math.js function addNumbers(a, b) { return 5; } Notice that the addNumbers() method always returns the value 5. Right-now, it will not pass a good unit test. Create this file and save it in your project with the name Math.js in your MVC project’s Scripts folder (Save the file in your actual MVC application and not your MVC test application). Creating the JavaScript Test Helper Class To make it easier to use the Microsoft Script Control in unit tests, we can create a helper class. This class contains two methods: LoadFile() – Loads a JavaScript file. Use this method to load the JavaScript file being tested or the JavaScript file containing the unit tests. ExecuteTest() – Executes the JavaScript code. Use this method to execute a JavaScript unit test. Here’s the code for the JavaScriptTestHelper class: JavaScriptTestHelper.cs   using System; using System.IO; using Microsoft.VisualStudio.TestTools.UnitTesting; using MSScriptControl; namespace MvcApplication1.Tests { public class JavaScriptTestHelper : IDisposable { private ScriptControl _sc; private TestContext _context; /// <summary> /// You need to use this helper with Unit Tests and not /// Basic Unit Tests because you need a Test Context /// </summary> /// <param name="testContext">Unit Test Test Context</param> public JavaScriptTestHelper(TestContext testContext) { if (testContext == null) { throw new ArgumentNullException("TestContext"); } _context = testContext; _sc = new ScriptControl(); _sc.Language = "JScript"; _sc.AllowUI = false; } /// <summary> /// Load the contents of a JavaScript file into the /// Script Engine. /// </summary> /// <param name="path">Path to JavaScript file</param> public void LoadFile(string path) { var fileContents = File.ReadAllText(path); _sc.AddCode(fileContents); } /// <summary> /// Pass the path of the test that you want to execute. /// </summary> /// <param name="testMethodName">JavaScript function name</param> public void ExecuteTest(string testMethodName) { dynamic result = null; try { result = _sc.Run(testMethodName, new object[] { }); } catch { var error = ((IScriptControl)_sc).Error; if (error != null) { var description = error.Description; var line = error.Line; var column = error.Column; var text = error.Text; var source = error.Source; if (_context != null) { var details = String.Format("{0} \r\nLine: {1} Column: {2}", source, line, column); _context.WriteLine(details); } } throw new AssertFailedException(error.Description); } } public void Dispose() { _sc = null; } } }     Notice that the JavaScriptTestHelper class requires a Test Context to be instantiated. For this reason, you can use the JavaScriptTestHelper only with a Visual Studio Unit Test and not a Basic Unit Test (These are two different types of Visual Studio project items). Add the JavaScriptTestHelper file to your MVC test application (for example, MvcApplication1.Tests). Creating the JavaScript Unit Test Next, we need to create the JavaScript unit test function that we will use to test the addNumbers() function. Create a folder in your MVC test project named JavaScriptTests and add the following JavaScript file to this folder: MvcApplication1.Tests\JavaScriptTests\MathTest.js /// <reference path="JavaScriptUnitTestFramework.js"/> function testAddNumbers() { // Act var result = addNumbers(1, 3); // Assert assert.areEqual(4, result, "addNumbers did not return right value!"); }   The testAddNumbers() function takes advantage of another JavaScript library named JavaScriptUnitTestFramework.js. This library contains all of the code necessary to make assertions. Add the following JavaScriptnitTestFramework.js to the same folder as the MathTest.js file: MvcApplication1.Tests\JavaScriptTests\JavaScriptUnitTestFramework.js var assert = { areEqual: function (expected, actual, message) { if (expected !== actual) { throw new Error("Expected value " + expected + " is not equal to " + actual + ". " + message); } } }; There is only one type of assertion supported by this file: the areEqual() assertion. Most likely, you would want to add additional types of assertions to this file to make it easier to write your JavaScript unit tests. Deploying the JavaScript Test Files This step is non-intuitive. When you use Visual Studio to run unit tests, Visual Studio creates a new folder and executes a copy of the files in your project. After you run your unit tests, your Visual Studio Solution will contain a new folder named TestResults that includes a subfolder for each test run. You need to configure Visual Studio to deploy your JavaScript files to the test run folder or Visual Studio won’t be able to find your JavaScript files when you execute your unit tests. You will get an error that looks something like this when you attempt to execute your unit tests: You can configure Visual Studio to deploy your JavaScript files by adding a Test Settings file to your Visual Studio Solution. It is important to understand that you need to add this file to your Visual Studio Solution and not a particular Visual Studio project. Right-click your Solution in the Solution Explorer window and select the menu option Add, New Item. Select the Test Settings item and click the Add button. After you create a Test Settings file for your solution, you can indicate that you want a particular folder to be deployed whenever you perform a test run. Select the menu option Test, Edit Test Settings to edit your test configuration file. Select the Deployment tab and select your MVC test project’s JavaScriptTest folder to deploy. Click the Apply button and the Close button to save the changes and close the dialog. Creating the Visual Studio Unit Test The very last step is to create the Visual Studio unit test (the MS Test unit test). Add a new unit test to your MVC test project by selecting the menu option Add New Item and selecting the Unit Test project item (Do not select the Basic Unit Test project item): The difference between a Basic Unit Test and a Unit Test is that a Unit Test includes a Test Context. We need this Test Context to use the JavaScriptTestHelper class that we created earlier. Enter the following test method for the new unit test: [TestMethod] public void TestAddNumbers() { var jsHelper = new JavaScriptTestHelper(this.TestContext); // Load JavaScript files jsHelper.LoadFile("JavaScriptUnitTestFramework.js"); jsHelper.LoadFile(@"..\..\..\MvcApplication1\Scripts\Math.js"); jsHelper.LoadFile("MathTest.js"); // Execute JavaScript Test jsHelper.ExecuteTest("testAddNumbers"); } This code uses the JavaScriptTestHelper to load three files: JavaScripUnitTestFramework.js – Contains the assert functions. Math.js – Contains the addNumbers() function from your MVC application which is being tested. MathTest.js – Contains the JavaScript unit test function. Next, the test method calls the JavaScriptTestHelper ExecuteTest() method to execute the testAddNumbers() JavaScript function. Running the Visual Studio JavaScript Unit Test After you complete all of the steps described above, you can execute the JavaScript unit test just like any other unit test. You can use the keyboard combination CTRL-R, CTRL-A to run all of the tests in the current Visual Studio Solution. Alternatively, you can use the buttons in the Visual Studio toolbar to run the tests: (Unfortunately, the Run All Impacted Tests button won’t work correctly because Visual Studio won’t detect that your JavaScript code has changed. Therefore, you should use either the Run Tests in Current Context or Run All Tests in Solution options instead.) The results of running the JavaScript tests appear side-by-side with the results of running the server tests in the Test Results window. For example, if you Run All Tests in Solution then you will get the following results: Notice that the TestAddNumbers() JavaScript test has failed. That is good because our addNumbers() function is hard-coded to always return the value 5. If you double-click the failing JavaScript test, you can view additional details such as the JavaScript error message and the line number of the JavaScript code that failed: Summary The goal of this blog entry was to explain an approach to creating JavaScript unit tests that can be easily integrated with Visual Studio and Visual Studio ALM. I described how you can use the Microsoft Script Control to execute JavaScript on the server. By taking advantage of the Microsoft Script Control, we were able to execute our JavaScript unit tests side-by-side with all of our other unit tests and view the results in the standard Visual Studio Test Results window. You can download the code discussed in this blog entry from here: http://StephenWalther.com/downloads/Blog/JavaScriptUnitTesting/JavaScriptUnitTests.zip Before running this code, you need to first install the Microsoft Script Control which you can download from here: http://www.microsoft.com/downloads/en/details.aspx?FamilyID=d7e31492-2595-49e6-8c02-1426fec693ac

    Read the article

  • Virtual host is not working in Ubuntu 14 VPS using XAMPP 1.8.3

    - by viral4ever
    I am using XAMPP as server in ubuntu 14.04 VPS of digitalocean. I tried to setup virtual hosts. But it is not working and I am getting 403 error of access denied. I changed files too. My files with changes are /opt/lampp/etc/httpd.conf # # This is the main Apache HTTP server configuration file. It contains the # configuration directives that give the server its instructions. # See <URL:http://httpd.apache.org/docs/trunk/> for detailed information. # In particular, see # <URL:http://httpd.apache.org/docs/trunk/mod/directives.html> # for a discussion of each configuration directive. # # Do NOT simply read the instructions in here without understanding # what they do. They're here only as hints or reminders. If you are unsure # consult the online docs. You have been warned. # # Configuration and logfile names: If the filenames you specify for many # of the server's control files begin with "/" (or "drive:/" for Win32), the # server will use that explicit path. If the filenames do *not* begin # with "/", the value of ServerRoot is prepended -- so 'log/access_log' # with ServerRoot set to '/www' will be interpreted by the # server as '/www/log/access_log', where as '/log/access_log' will be # interpreted as '/log/access_log'. # # ServerRoot: The top of the directory tree under which the server's # configuration, error, and log files are kept. # # Do not add a slash at the end of the directory path. If you point # ServerRoot at a non-local disk, be sure to specify a local disk on the # Mutex directive, if file-based mutexes are used. If you wish to share the # same ServerRoot for multiple httpd daemons, you will need to change at # least PidFile. # ServerRoot "/opt/lampp" # # Mutex: Allows you to set the mutex mechanism and mutex file directory # for individual mutexes, or change the global defaults # # Uncomment and change the directory if mutexes are file-based and the default # mutex file directory is not on a local disk or is not appropriate for some # other reason. # # Mutex default:logs # # Listen: Allows you to bind Apache to specific IP addresses and/or # ports, instead of the default. See also the <VirtualHost> # directive. # # Change this to Listen on specific IP addresses as shown below to # prevent Apache from glomming onto all bound IP addresses. # #Listen 12.34.56.78:80 Listen 80 # # Dynamic Shared Object (DSO) Support # # To be able to use the functionality of a module which was built as a DSO you # have to place corresponding `LoadModule' lines at this location so the # directives contained in it are actually available _before_ they are used. # Statically compiled modules (those listed by `httpd -l') do not need # to be loaded here. # # Example: # LoadModule foo_module modules/mod_foo.so # LoadModule authn_file_module modules/mod_authn_file.so LoadModule authn_dbm_module modules/mod_authn_dbm.so LoadModule authn_anon_module modules/mod_authn_anon.so LoadModule authn_dbd_module modules/mod_authn_dbd.so LoadModule authn_socache_module modules/mod_authn_socache.so LoadModule authn_core_module modules/mod_authn_core.so LoadModule authz_host_module modules/mod_authz_host.so LoadModule authz_groupfile_module modules/mod_authz_groupfile.so LoadModule authz_user_module modules/mod_authz_user.so LoadModule authz_dbm_module modules/mod_authz_dbm.so LoadModule authz_owner_module modules/mod_authz_owner.so LoadModule authz_dbd_module modules/mod_authz_dbd.so LoadModule authz_core_module modules/mod_authz_core.so LoadModule authnz_ldap_module modules/mod_authnz_ldap.so LoadModule access_compat_module modules/mod_access_compat.so LoadModule auth_basic_module modules/mod_auth_basic.so LoadModule auth_form_module modules/mod_auth_form.so LoadModule auth_digest_module modules/mod_auth_digest.so LoadModule allowmethods_module modules/mod_allowmethods.so LoadModule file_cache_module modules/mod_file_cache.so LoadModule cache_module modules/mod_cache.so LoadModule cache_disk_module modules/mod_cache_disk.so LoadModule socache_shmcb_module modules/mod_socache_shmcb.so LoadModule socache_dbm_module modules/mod_socache_dbm.so LoadModule socache_memcache_module modules/mod_socache_memcache.so LoadModule dbd_module modules/mod_dbd.so LoadModule bucketeer_module modules/mod_bucketeer.so LoadModule dumpio_module modules/mod_dumpio.so LoadModule echo_module modules/mod_echo.so LoadModule case_filter_module modules/mod_case_filter.so LoadModule case_filter_in_module modules/mod_case_filter_in.so LoadModule buffer_module modules/mod_buffer.so LoadModule ratelimit_module modules/mod_ratelimit.so LoadModule reqtimeout_module modules/mod_reqtimeout.so LoadModule ext_filter_module modules/mod_ext_filter.so LoadModule request_module modules/mod_request.so LoadModule include_module modules/mod_include.so LoadModule filter_module modules/mod_filter.so LoadModule substitute_module modules/mod_substitute.so LoadModule sed_module modules/mod_sed.so LoadModule charset_lite_module modules/mod_charset_lite.so LoadModule deflate_module modules/mod_deflate.so LoadModule mime_module modules/mod_mime.so LoadModule ldap_module modules/mod_ldap.so LoadModule log_config_module modules/mod_log_config.so LoadModule log_debug_module modules/mod_log_debug.so LoadModule logio_module modules/mod_logio.so LoadModule env_module modules/mod_env.so LoadModule mime_magic_module modules/mod_mime_magic.so LoadModule cern_meta_module modules/mod_cern_meta.so LoadModule expires_module modules/mod_expires.so LoadModule headers_module modules/mod_headers.so LoadModule usertrack_module modules/mod_usertrack.so LoadModule unique_id_module modules/mod_unique_id.so LoadModule setenvif_module modules/mod_setenvif.so LoadModule version_module modules/mod_version.so LoadModule remoteip_module modules/mod_remoteip.so LoadModule proxy_module modules/mod_proxy.so LoadModule proxy_connect_module modules/mod_proxy_connect.so LoadModule proxy_ftp_module modules/mod_proxy_ftp.so LoadModule proxy_http_module modules/mod_proxy_http.so LoadModule proxy_fcgi_module modules/mod_proxy_fcgi.so LoadModule proxy_scgi_module modules/mod_proxy_scgi.so LoadModule proxy_ajp_module modules/mod_proxy_ajp.so LoadModule proxy_balancer_module modules/mod_proxy_balancer.so LoadModule proxy_express_module modules/mod_proxy_express.so LoadModule session_module modules/mod_session.so LoadModule session_cookie_module modules/mod_session_cookie.so LoadModule session_dbd_module modules/mod_session_dbd.so LoadModule slotmem_shm_module modules/mod_slotmem_shm.so LoadModule ssl_module modules/mod_ssl.so LoadModule lbmethod_byrequests_module modules/mod_lbmethod_byrequests.so LoadModule lbmethod_bytraffic_module modules/mod_lbmethod_bytraffic.so LoadModule lbmethod_bybusyness_module modules/mod_lbmethod_bybusyness.so LoadModule lbmethod_heartbeat_module modules/mod_lbmethod_heartbeat.so LoadModule unixd_module modules/mod_unixd.so LoadModule dav_module modules/mod_dav.so LoadModule status_module modules/mod_status.so LoadModule autoindex_module modules/mod_autoindex.so LoadModule info_module modules/mod_info.so LoadModule suexec_module modules/mod_suexec.so LoadModule cgi_module modules/mod_cgi.so LoadModule cgid_module modules/mod_cgid.so LoadModule dav_fs_module modules/mod_dav_fs.so LoadModule vhost_alias_module modules/mod_vhost_alias.so LoadModule negotiation_module modules/mod_negotiation.so LoadModule dir_module modules/mod_dir.so LoadModule actions_module modules/mod_actions.so LoadModule speling_module modules/mod_speling.so LoadModule userdir_module modules/mod_userdir.so LoadModule alias_module modules/mod_alias.so LoadModule rewrite_module modules/mod_rewrite.so <IfDefine JUSTTOMAKEAPXSHAPPY> LoadModule php4_module modules/libphp4.so LoadModule php5_module modules/libphp5.so </IfDefine> <IfModule unixd_module> # # If you wish httpd to run as a different user or group, you must run # httpd as root initially and it will switch. # # User/Group: The name (or #number) of the user/group to run httpd as. # It is usually good practice to create a dedicated user and group for # running httpd, as with most system services. # User root Group www </IfModule> # 'Main' server configuration # # The directives in this section set up the values used by the 'main' # server, which responds to any requests that aren't handled by a # <VirtualHost> definition. These values also provide defaults for # any <VirtualHost> containers you may define later in the file. # # All of these directives may appear inside <VirtualHost> containers, # in which case these default settings will be overridden for the # virtual host being defined. # # # ServerAdmin: Your address, where problems with the server should be # e-mailed. This address appears on some server-generated pages, such # as error documents. e.g. [email protected] # ServerAdmin [email protected] # # ServerName gives the name and port that the server uses to identify itself. # This can often be determined automatically, but we recommend you specify # it explicitly to prevent problems during startup. # # If your host doesn't have a registered DNS name, enter its IP address here. # #ServerName www.example.com:@@Port@@ # XAMPP ServerName localhost # # Deny access to the entirety of your server's filesystem. You must # explicitly permit access to web content directories in other # <Directory> blocks below. # <Directory /> AllowOverride none Require all denied </Directory> # # Note that from this point forward you must specifically allow # particular features to be enabled - so if something's not working as # you might expect, make sure that you have specifically enabled it # below. # # # DocumentRoot: The directory out of which you will serve your # documents. By default, all requests are taken from this directory, but # symbolic links and aliases may be used to point to other locations. # DocumentRoot "/opt/lampp/htdocs" <Directory "/opt/lampp/htdocs"> # # Possible values for the Options directive are "None", "All", # or any combination of: # Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews # # Note that "MultiViews" must be named *explicitly* --- "Options All" # doesn't give it to you. # # The Options directive is both complicated and important. Please see # http://httpd.apache.org/docs/trunk/mod/core.html#options # for more information. # #Options Indexes FollowSymLinks # XAMPP Options Indexes FollowSymLinks ExecCGI Includes # # AllowOverride controls what directives may be placed in .htaccess files. # It can be "All", "None", or any combination of the keywords: # Options FileInfo AuthConfig Limit # #AllowOverride None # since XAMPP 1.4: AllowOverride All # # Controls who can get stuff from this server. # Require all granted </Directory> # # DirectoryIndex: sets the file that Apache will serve if a directory # is requested. # <IfModule dir_module> #DirectoryIndex index.html # XAMPP DirectoryIndex index.html index.html.var index.php index.php3 index.php4 </IfModule> # # The following lines prevent .htaccess and .htpasswd files from being # viewed by Web clients. # <Files ".ht*"> Require all denied </Files> # # ErrorLog: The location of the error log file. # If you do not specify an ErrorLog directive within a <VirtualHost> # container, error messages relating to that virtual host will be # logged here. If you *do* define an error logfile for a <VirtualHost> # container, that host's errors will be logged there and not here. # ErrorLog "logs/error_log" # # LogLevel: Control the number of messages logged to the error_log. # Possible values include: debug, info, notice, warn, error, crit, # alert, emerg. # LogLevel warn <IfModule log_config_module> # # The following directives define some format nicknames for use with # a CustomLog directive (see below). # LogFormat "%h %l %u %t \"%r\" %>s %b \"%{Referer}i\" \"%{User-Agent}i\"" combined LogFormat "%h %l %u %t \"%r\" %>s %b" common <IfModule logio_module> # You need to enable mod_logio.c to use %I and %O LogFormat "%h %l %u %t \"%r\" %>s %b \"%{Referer}i\" \"%{User-Agent}i\" %I %O" combinedio </IfModule> # # The location and format of the access logfile (Common Logfile Format). # If you do not define any access logfiles within a <VirtualHost> # container, they will be logged here. Contrariwise, if you *do* # define per-<VirtualHost> access logfiles, transactions will be # logged therein and *not* in this file. # CustomLog "logs/access_log" common # # If you prefer a logfile with access, agent, and referer information # (Combined Logfile Format) you can use the following directive. # #CustomLog "logs/access_log" combined </IfModule> <IfModule alias_module> # # Redirect: Allows you to tell clients about documents that used to # exist in your server's namespace, but do not anymore. The client # will make a new request for the document at its new location. # Example: # Redirect permanent /foo http://www.example.com/bar # # Alias: Maps web paths into filesystem paths and is used to # access content that does not live under the DocumentRoot. # Example: # Alias /webpath /full/filesystem/path # # If you include a trailing / on /webpath then the server will # require it to be present in the URL. You will also likely # need to provide a <Directory> section to allow access to # the filesystem path. # # ScriptAlias: This controls which directories contain server scripts. # ScriptAliases are essentially the same as Aliases, except that # documents in the target directory are treated as applications and # run by the server when requested rather than as documents sent to the # client. The same rules about trailing "/" apply to ScriptAlias # directives as to Alias. # ScriptAlias /cgi-bin/ "/opt/lampp/cgi-bin/" </IfModule> <IfModule cgid_module> # # ScriptSock: On threaded servers, designate the path to the UNIX # socket used to communicate with the CGI daemon of mod_cgid. # #Scriptsock logs/cgisock </IfModule> # # "/opt/lampp/cgi-bin" should be changed to whatever your ScriptAliased # CGI directory exists, if you have that configured. # <Directory "/opt/lampp/cgi-bin"> AllowOverride None Options None Require all granted </Directory> <IfModule mime_module> # # TypesConfig points to the file containing the list of mappings from # filename extension to MIME-type. # TypesConfig etc/mime.types # # AddType allows you to add to or override the MIME configuration # file specified in TypesConfig for specific file types. # #AddType application/x-gzip .tgz # # AddEncoding allows you to have certain browsers uncompress # information on the fly. Note: Not all browsers support this. # #AddEncoding x-compress .Z #AddEncoding x-gzip .gz .tgz # # If the AddEncoding directives above are commented-out, then you # probably should define those extensions to indicate media types: # AddType application/x-compress .Z AddType application/x-gzip .gz .tgz # # AddHandler allows you to map certain file extensions to "handlers": # actions unrelated to filetype. These can be either built into the server # or added with the Action directive (see below) # # To use CGI scripts outside of ScriptAliased directories: # (You will also need to add "ExecCGI" to the "Options" directive.) # #AddHandler cgi-script .cgi # XAMPP, since LAMPP 0.9.8: AddHandler cgi-script .cgi .pl # For type maps (negotiated resources): #AddHandler type-map var # # Filters allow you to process content before it is sent to the client. # # To parse .shtml files for server-side includes (SSI): # (You will also need to add "Includes" to the "Options" directive.) # # XAMPP AddType text/html .shtml AddOutputFilter INCLUDES .shtml </IfModule> # # The mod_mime_magic module allows the server to use various hints from the # contents of the file itself to determine its type. The MIMEMagicFile # directive tells the module where the hint definitions are located. # #MIMEMagicFile etc/magic # # Customizable error responses come in three flavors: # 1) plain text 2) local redirects 3) external redirects # # Some examples: #ErrorDocument 500 "The server made a boo boo." #ErrorDocument 404 /missing.html #ErrorDocument 404 "/cgi-bin/missing_handler.pl" #ErrorDocument 402 http://www.example.com/subscription_info.html # # # MaxRanges: Maximum number of Ranges in a request before # returning the entire resource, or one of the special # values 'default', 'none' or 'unlimited'. # Default setting is to accept 200 Ranges. #MaxRanges unlimited # # EnableMMAP and EnableSendfile: On systems that support it, # memory-mapping or the sendfile syscall may be used to deliver # files. This usually improves server performance, but must # be turned off when serving from networked-mounted # filesystems or if support for these functions is otherwise # broken on your system. # Defaults: EnableMMAP On, EnableSendfile Off # EnableMMAP off EnableSendfile off # Supplemental configuration # # The configuration files in the etc/extra/ directory can be # included to add extra features or to modify the default configuration of # the server, or you may simply copy their contents here and change as # necessary. # Server-pool management (MPM specific) #Include etc/extra/httpd-mpm.conf # Multi-language error messages Include etc/extra/httpd-multilang-errordoc.conf # Fancy directory listings Include etc/extra/httpd-autoindex.conf # Language settings #Include etc/extra/httpd-languages.conf # User home directories #Include etc/extra/httpd-userdir.conf # Real-time info on requests and configuration #Include etc/extra/httpd-info.conf # Virtual hosts Include etc/extra/httpd-vhosts.conf # Local access to the Apache HTTP Server Manual #Include etc/extra/httpd-manual.conf # Distributed authoring and versioning (WebDAV) #Include etc/extra/httpd-dav.conf # Various default settings Include etc/extra/httpd-default.conf # Configure mod_proxy_html to understand HTML4/XHTML1 <IfModule proxy_html_module> Include etc/extra/proxy-html.conf </IfModule> # Secure (SSL/TLS) connections <IfModule ssl_module> # XAMPP <IfDefine SSL> Include etc/extra/httpd-ssl.conf </IfDefine> </IfModule> # # Note: The following must must be present to support # starting without SSL on platforms with no /dev/random equivalent # but a statically compiled-in mod_ssl. # <IfModule ssl_module> SSLRandomSeed startup builtin SSLRandomSeed connect builtin </IfModule> # XAMPP Include etc/extra/httpd-xampp.conf Include "/opt/lampp/apache2/conf/httpd.conf" I used command shown in this example. I used below lines to change and add group Add group "groupadd www" Add user to group "usermod -aG www root" Change htdocs group "chgrp -R www /opt/lampp/htdocs" Change sitedir group "chgrp -R www /opt/lampp/htdocs/mysite" Change htdocs chmod "chmod 2775 /opt/lampp/htdocs" Change sitedir chmod "chmod 2775 /opt/lampp/htdocs/mysite" And then I changed my vhosts.conf file # Virtual Hosts # # Required modules: mod_log_config # If you want to maintain multiple domains/hostnames on your # machine you can setup VirtualHost containers for them. Most configurations # use only name-based virtual hosts so the server doesn't need to worry about # IP addresses. This is indicated by the asterisks in the directives below. # # Please see the documentation at # <URL:http://httpd.apache.org/docs/2.4/vhosts/> # for further details before you try to setup virtual hosts. # # You may use the command line option '-S' to verify your virtual host # configuration. # # VirtualHost example: # Almost any Apache directive may go into a VirtualHost container. # The first VirtualHost section is used for all requests that do not # match a ServerName or ServerAlias in any <VirtualHost> block. # <VirtualHost *:80> ServerAdmin [email protected] DocumentRoot "/opt/lampp/docs/dummy-host.example.com" ServerName dummy-host.example.com ServerAlias www.dummy-host.example.com ErrorLog "logs/dummy-host.example.com-error_log" CustomLog "logs/dummy-host.example.com-access_log" common </VirtualHost> <VirtualHost *:80> ServerAdmin [email protected] DocumentRoot "/opt/lampp/docs/dummy-host2.example.com" ServerName dummy-host2.example.com ErrorLog "logs/dummy-host2.example.com-error_log" CustomLog "logs/dummy-host2.example.com-access_log" common </VirtualHost> NameVirtualHost * <VirtualHost *> ServerAdmin [email protected] DocumentRoot "/opt/lampp/htdocs/mysite" ServerName mysite.com ServerAlias mysite.com ErrorLog "/opt/lampp/htdocs/mysite/errorlogs" CustomLog "/opt/lampp/htdocs/mysite/customlog" common <Directory "/opt/lampp/htdocs/mysite"> Options Indexes FollowSymLinks Includes ExecCGI AllowOverride All Order Allow,Deny Allow from all Require all granted </Directory> </VirtualHost> but still its not working and I am getting 403 error on my ip and domain however I can access phpmyadmin. If anyone can help me, please help me.

    Read the article

  • CSS IE Hover Effect - Overlapping Elements, Display:Block, and Crashes

    - by Emtucifor
    In a fairly simple page, I have some text appear on hover over some links, like a tooltip. To start with here's my test page I'm working with: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Tooltip Test Page</title> <style type="text/css"> html, body, form, table, tr, td, div, p, h1, h2, h3, h4, h5 { border:0; margin:0; padding:0; } body { margin:10px; } html, body, table { font-family:Arial, Helvetica, sans-serif; font-size:12px; } h1 { font-weight:bold; font-size:16px; } table {border-collapse:collapse;} td {padding:0 8px 0 0;} a.tooltip { z-index:24; text-decoration:none; cursor:default; position:relative; color:#000; display:block; width:100px; } a.tooltip span {display:none;} a.tooltip:hover, a.tooltip:active { z-index:25; color:; background:; /* the color and background actually don't matter for their values, it's just that these have to change for IE to apply this style properly. Leaving out the color or the background makes this fail in different ways. */ } a.tooltip:hover span, a.tooltip:active span { display:block; position:absolute; color:black; background-color:#FFFFCC; border:1px solid black; padding:1px; text-align:left; top:0; left:0; margin-top:-1px; } td span.s5 {color:#ff0000} td span.s6 {color:#0000ff} </style> <script type="text/javascript"> function labelSubmit(label) { document.getElementById('o').value=label; document.BackAt.submit(); } </script> </head> <body> <h1>tooltip Test Page</h1> <table> <tbody> <tr> <td><span class="s6">&#x25a0;</span> Name 3</td> <td class="status"><a class="tooltip" href="" onclick="return false;">Status 6<span>Some very long tooltip text to demonstrate the problem by overlapping the cells below.</span></a></td> </tr> <tr> <td><span class="s6">&#x25a0;</span> Name 1</td> <td class="status"><a class="tooltip" href="" onclick="return false;">Status 6</a></td> </tr> <tr> <td><span class="s6">&#x25a0;</span> Name 2</td> <td class="status"><a class="tooltip" href="" onclick="return false;">Status 6<span>Some tooltip text</span></a></td> </tr> <tr> <td><span class="s6">&#x25a0;</span> Name 4</td> <td class="status"><a class="tooltip" href="" onclick="return false;">Status 6</a></td> </tr> <tr> <td><span class="s5">&#x25a0;</span> Name 5</td> <td class="status"><a class="tooltip" href="" onclick="return false;">Status 5<span>More Notes</span></a></td> </tr> <tr> <td><span class="s6">&#x25a0;</span> Name 6</td> <td class="status"><a class="tooltip" href="" onclick="return false;">Status 6<span>Yet more notes</span></a></td> </tr> </tbody> </table> </body> </html> The problem I'm experiencing is that text from other values shows through the tooltip text. Hover over the first row, second column to see the effect. There are a couple of things I'm trying to accomplish: Make the activation area for the hover wider, so hovering over some space to the right of "Status 6" calls up the tooltip (say, 100-150px total width of target). At first, when I was adding "display:block" to a.tooltip, IE was terminating on hover. I resolved that by removing width:14em from a.tooltip:hover. Styling the width of the hover event + display.block on the a element does BAD things. Change the width of the tooltip without changing the width of the column/parent element (so the tooltip can be wider than itso it takes up less vertical space). Options for making the tooltips change width with its contents up to a max width, at which point the lines wrap would be awesome, but probably impossible in IE. As soon as I put a width in place on a.tooltip, the portion of the tooltip that is above other rows than the hover source let text show through from those cells. Remove the width and you'll see that the text doesn't show through any more. The hover effect applies to the entire tooltip, so if the tooltip covers 3 rows, while moving the mouse downward, the next 2 rows won't activate because the cursor hasn't left the tooltip. Can the hover effect apply only to the initial element hovered over and not the tooltip itself so moving the mouse downward will show each tooltip in each row? It would be nice if the links could never be activated (they can't take the focus). I don't know if that's possible. Too bad IE doesn't support hover on any elements but links. Note: soon IE6 will be abandoned in favor of IE8. If it makes a big difference, then IE8 can be the target browser instead. Thanks for your help.

    Read the article

  • SVG as CSS background for website navigation-bar

    - by Irfan Mir
    I drew a small (horizontal / in width) svg to be the background of my website's navigation. My website's navigation takes place a 100% of the browser's viewport and I want the svg image to fill that 100% space. So, using css I set the background of the navigation (.nav) to nav.svg but then I saw (whenI opened the html file in a browser) that the svg was not the full-width of the nav, but at the small width I drew it at. How can I get the SVG to stretch and fill the entire width of the navigation (100% of the page) ? Here is the code for the html file where the navigation is in: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Distributed Horizontal Menu</title> <meta name="generator" content="PSPad editor, www.pspad.com"> <style type="text/css"> *{ margin:0; padding:0; } .nav { margin:0; padding:0; min-width:42em; width:100%; height:47px; overflow:hidden; background:transparent url(nav.svg) no-repeat; text-align:justify; font:bold 88%/1.1 verdana; } .nav li { display:inline; list-style:none; } .nav li.last { margin-right:100%; } .nav li a { display:inline-block; padding:13px 4px 0; height:31px; color:#fff; vertical-align:middle; text-decoration:none; } .nav li a:hover { color:#ff6; background:#36c; } @media screen and (max-width:322px){ /* styling causing first break will go here*/ /* but in the meantime, a test */ body{ background:#ff0000; } } </style></head><body> <ul class="nav"> <!--[test to comment out random items] <li>&nbsp; <a href="#">netscape&nbsp;9</a></li> [the spacing should be distributed]--> <li>&nbsp; <a href="#">internet&nbsp;explorer&nbsp;6-8</a></li> <li>&nbsp; <a href="#">opera&nbsp;10</a></li> <li>&nbsp; <a href="#">firefox&nbsp;3</a></li> <li>&nbsp; <a href="#">safari&nbsp;4</a></li> <li class="last">&nbsp; <a href="#">chrome&nbsp;2</a> &nbsp; &nbsp;</li> </ul> </body></html> and Here is the code for the svg: <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="321.026px" height="44.398px" viewBox="39.487 196.864 321.026 44.398" enable-background="new 39.487 196.864 321.026 44.398" xml:space="preserve"> <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="280" y1="316.8115" x2="280" y2="275.375" gradientTransform="matrix(1 0 0 1 -80 -77)"> <stop offset="0" style="stop-color:#5A4A6A"/> <stop offset="0.3532" style="stop-color:#605170"/> <stop offset="0.8531" style="stop-color:#726382"/> <stop offset="1" style="stop-color:#796A89"/> </linearGradient> <path fill="url(#SVGID_1_)" d="M360,238.721c0,1.121-0.812,2.029-1.812,2.029H41.813c-1.001,0-1.813-0.908-1.813-2.029v-39.316 c0-1.119,0.812-2.027,1.813-2.027h316.375c1.002,0,1.812,0.908,1.812,2.027V238.721z"/> <path opacity="0.1" fill="#FFFFFF" enable-background="new " d="M358.188,197.376H41.813c-1.001,0-1.813,0.908-1.813,2.028 v39.316c0,1.12,0.812,2.028,1.813,2.028h316.375c1,0,1.812-0.908,1.812-2.028v-39.316C360,198.284,359.189,197.376,358.188,197.376z M358.75,238.721c0,0.415-0.264,0.779-0.562,0.779H41.813c-0.3,0-0.563-0.363-0.563-0.779v-39.316c0-0.414,0.263-0.777,0.563-0.777 h316.375c0.301,0,0.562,0.363,0.562,0.777V238.721z"/> <path opacity="0.5" fill="#FFFFFF" enable-background="new " d="M358.188,197.376H41.813c-1.001,0-1.813,0.908-1.813,2.028v1.461 c0-1.12,0.812-2.028,1.813-2.028h316.375c1.002,0,1.812,0.908,1.812,2.028v-1.461C360,198.284,359.189,197.376,358.188,197.376z"/> <g id="seperators"> <line fill="none" stroke="#000000" stroke-width="1.0259" stroke-miterlimit="10" x1="104.5" y1="197.375" x2="104.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="103.5" y1="197.375" x2="103.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="105.5" y1="197.375" x2="105.5" y2="240.75"/> <line fill="none" stroke="#000000" stroke-width="1.0259" stroke-miterlimit="10" x1="167.5" y1="197.375" x2="167.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="166.5" y1="197.375" x2="166.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="168.5" y1="197.375" x2="168.5" y2="240.75"/> <line fill="none" stroke="#000000" stroke-width="1.0259" stroke-miterlimit="10" x1="231.5" y1="197.375" x2="231.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="232.5" y1="197.375" x2="232.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="230.5" y1="197.375" x2="230.5" y2="240.75"/> <line fill="none" stroke="#000000" stroke-width="1.0259" stroke-miterlimit="10" x1="295.5" y1="197.375" x2="295.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="294.5" y1="197.375" x2="294.5" y2="240.75"/> <line opacity="0.1" fill="none" stroke="#FFFFFF" stroke-width="1.0259" stroke-miterlimit="10" enable-background="new " x1="296.5" y1="197.375" x2="296.5" y2="240.75"/> </g> <path fill="none" stroke="#000000" stroke-width="1.0259" stroke-miterlimit="10" d="M360,238.721c0,1.121-0.812,2.029-1.812,2.029 H41.813c-1.001,0-1.813-0.908-1.813-2.029v-39.316c0-1.119,0.812-2.027,1.813-2.027h316.375c1.002,0,1.812,0.908,1.812,2.027 V238.721z"/> </svg> I appreciate and welcome any and all comments, help, and suggestions. Thanks in Advance!

    Read the article

< Previous Page | 2 3 4 5 6 7  | Next Page >