JSFiddle - React, Tailwind, and code Playground

by shanabus

HTML

<!DOCTYPE html>  
<html>      
    <head>      
        <title>Sample Page</title>           
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />    
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>        
        <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> 
    </head>   
    <body>              
        <div data-role="page" id="page1">      
            <div data-role="header">         
                <h1>
                    Page 1
                </h1>     
            </div><!-- /header -->      
            
            <div data-role="content">
                
                <form action="scoresheet.php?sessionId=<?php echo $_SESSION['sessionId']; ?>" id="formScoresheet">
                
                <div data-role="fieldcontain">

                  <ul data-role="listview" data-inset="true">
        
                    <li>    <label for="slider-2">Subject1</label>
                            <input type="range" name="subject1" id="subject1" value="0" min="1" max="10"  />
                    </li>   
                    <li>    <label for="slider-2">Subject2</label>
                            <input type="range" name="subject2" id="subject2" value="0" min="1" max="10"  />
                    </li>  
                   </ul> 
                </div>

                    <a data-role="button" id="fakeSubmit">Fake Submit</a>
                    
                </form>
                
            </div><!-- /content -->      
            
            <div data-role="footer">              
            </div> 
        </div><!-- /page -->      
        
        <div data-role="page" id="page2">         
            <div data-role="header">    
               <h1>
                  Page 2
                </h1>     
            </div><!-- /header -->         
            
            <div...

JavaScript

$("#fakeSubmit").click(function() {
    var sub1, sub2;
    sub1 = $("#subject1").val();
    sub2 = $("#subject2").val();
    alert("I would post { subject1=" + sub1 + ", subject2=" + sub2 + "}");
});