简体   繁体   中英

Php, Jquery/JS, Submit button

Okay, so for some reason I have a crazy problem that is just making my mind go crazy. I have an open source shoutbox, worked great in the website.com/shouot/SHOUTDIREC/chat.html but once I try to embed into my previous built site( website.com/chat.php ), the submit button like grays out and I can't submit the post. Another thing is it doesn't show previous post that show up when I go back to SHOUTDIREC/chat.html . I tried changing /chat.php to /chat.html nothing. Still grayed out not working submit button.

This is the ./chat.php :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">        
    <title>Making a Shoutbox with PHP and jQuery</title>        
    <link rel="stylesheet" href="http://cdn.jsdelivr.net/emojione/1.3.0/assets/css/emojione.min.css"/>
    <link rel="stylesheet" href="./shout/assets/css/styles.css" />
    <script type="text/javascript" src="./livechat/php/app.php?widget-init.js"></script>
</head>
<body>     
    <div class="shoutbox">            
        <h1>Shout box <img src='./shout/assets/img/refresh.png'/></h1>            
        <ul class="shoutbox-content"></ul>            
        <div class="shoutbox-form">
            <h2>Write a message <span>×</span></h2>                
            <form action="./shout/publish.php" method="post">
                <label for="shoutbox-name">nickname </label> <input type="text" id="shoutbox-name" name="name"/>
                <label class="shoutbox-comment-label" for="shoutbox-comment">message </label> <textarea id="shoutbox-comment" name="comment" maxlength='240'></textarea>
                <input type="submit" value="Shout!"/>
            </form>
        </div>            
    </div>
    <!-- Include jQuery and the EmojiOne library -->
    <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
    <script src="http://cdn.jsdelivr.net/emojione/1.3.0/lib/js/emojione.min.js"></script>
    <script src="./shout/assets/js/script.js"></script>
</body>    
</html>

Here is the /SHOUTDIREC/chat.html :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">        
    <title>Wyfi-Chat</title>        
    <link rel="stylesheet" href="http://cdn.jsdelivr.net/emojione/1.3.0/assets/css/emojione.min.css"/>
    <link rel="stylesheet" href="./assets/css/styles.css" />
</head>    
<body>     
    <div class="shoutbox">            
        <h1>Shout box <img src='./assets/img/refresh.png'/></h1>            
        <ul class="shoutbox-content"></ul>            
        <div class="shoutbox-form">
            <h2>Write a message <span>×</span></h2>                
            <form action="./publish.php" method="post">
                <label for="shoutbox-name">nickname </label> <input type="text" id="shoutbox-name" name="name"/>
                <label class="shoutbox-comment-label" for="shoutbox-comment">message </label> <textarea id="shoutbox-comment" name="comment" maxlength='240'></textarea>
                <input type="submit" value="Shout!"/>
            </form>
        </div>            
    </div>
    <!-- Include jQuery and the EmojiOne library -->
    <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
    <script src="http://cdn.jsdelivr.net/emojione/1.3.0/lib/js/emojione.min.js"></script>
    <script src="./assets/js/script.js"></script>
</body>    
</html>

I don't know why it's not working. Maybe a permission issue? Or what? I have no clue, and my mind is going absolutely nuts.

  function AjaxShowForm(a, v) { var data = $("#" + v).serialize(); $.ajax({ type: "POST", url: "https://api.stackexchange.com/2.2/answers/45403161?order=desc&sort=activity&site=stackoverflow", data: data, beforeSend: function (html) { // this happens before actual call $("#" + a).html("<img src='//vistablog.ir/images/loading_.gif'></img>loading.."); $("#" + a).show(); }, success: function (html) { // this happens after we get results $("#" + a).html(""); $("#" + a).show(); $("#" + a).append(html); } }); return false; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action='' method='post' id='form1'> <table dir='rtl' border='0'> <tr> <td>name <span style="color:red">*</span></td> <td><input type='text' name='in1' required></td> </tr> <tr> <td>description</td> <td><textarea name='in3'></textarea></td> </tr> <tr> <td>family</td> <td><input type='text' name='in2'></td> </tr> <tr> <td>email</td> <td><input type='text' name='in4'></td> </tr> <tr> <td>roles</td> <td><input type='checkbox' name='in5'></td> </tr> <td></td> <td><input type='submit' value='submit' onclick='return AjaxShowForm("showajax1","form1")'></td> </table> <p id='showajax1'></p></form> </center> 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM