Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div class="right-body">
        <h3>Heroes Manager</h3>
        <table cellspacing="0" cellpadding="0" width="100%" class="listData">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Star</th>
                    <th>Fuse</th>
                    <th>Level</th>
                    <th>EXP</th>
                    <th>Item</th>
                    <th width="180px"><a href="#" class="addNewHero">[Add hero]</a></th>
                </tr>
            </thead>
            <tbody>
                
            </tbody>
        </table>
    </div>
  <!-- TEMPLATE :: Create new Hero -->
<script type="text/x-handlebars-template" id="TemplateCreateNewHero">
    <tr data-href="/member/hero?id=1" data-token="kVwvztvQKUZ8ZWenydkBTjpB9JJ9X9qu" data-commit="HBSQL_Hero_Form_Create">
        <td>
            <input type="text" name="hero_id" value="0" data-old="0" form-hero="int:1" />
        </td>
        <td>
            <input type="text" name="hero_star" value="1" data-old="1" form-hero="int:1:5" />
        </td>
        <td>
            <input type="text" name="hero_fuse" value="0" data-old="0" form-hero="int:0" />
        </td>
        <td>
            <input type="text" name="hero_level" value="1" data-old="0" form-hero="int:1:100" />
        </td>
        <td>
            <input type="text" name="hero_exp" value="0" data-old="0" form-hero="int:0" />
        </td>
        <td>
            <input type="text" name="hero_item" value="" data-old="" form-hero="str:1" class="openPopup" placeholder="Click here edit item" readonly />
            <div class="popuppannel">
                <div class="popupboard">
                    <h3>Hero Item</h3>
                    <form class="popupform heroItem">
                        <p>Hero ID: <strong></strong></p>
                        <table cellspacing="0" cellpadding="0" width="100%" class="listData">
                            <thead>
                                <tr>
                                    <th width="25%">Index</th>
                                    <th width="25%">ID</th>
                                    <th width="25%">EXP</th>
                                    <th width="25%">Equip</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN1}}][index]" value="1" readonly />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN1}}][id]" value="0" form-valid="int:1" />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN1}}][exp]" value="0" form-valid="int:0" />
                                    </td>
                                    <td>
                                        <label class="checkbox" data-old="false">
                                            <input type="hidden" name="item[{{HTOKEN1}}][equip]" value="false" />
                                            <span class=""></span>
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN2}}][index]" value="2" readonly />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN2}}][id]" value="0" form-valid="int:1" />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN2}}][exp]" value="0" form-valid="int:0" />
                                    </td>
                                    <td>
                                        <label class="checkbox" data-old="false">
                                            <input type="hidden" name="item[{{HTOKEN2}}][equip]" value="false" />
                                            <span class=""></span>
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN3}}][index]" value="3" readonly />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN3}}][id]" value="0" form-valid="int:1" />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN3}}][exp]" value="0" form-valid="int:0" />
                                    </td>
                                    <td>
                                        <label class="checkbox" data-old="false">
                                            <input type="hidden" name="item[{{HTOKEN3}}][equip]" value="false" />
                                            <span class=""></span>
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN4}}][index]" value="4" readonly />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN4}}][id]" value="0" form-valid="int:1" />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN4}}][exp]" value="0" form-valid="int:0" />
                                    </td>
                                    <td>
                                        <label class="checkbox" data-old="false">
                                            <input type="hidden" name="item[{{HTOKEN4}}][equip]" value="false" />
                                            <span class=""></span>
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN5}}][index]" value="5" readonly />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN5}}][id]" value="0" form-valid="int:1" />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN5}}][exp]" value="0" form-valid="int:0" />
                                    </td>
                                    <td>
                                        <label class="checkbox" data-old="false">
                                            <input type="hidden" name="item[{{HTOKEN5}}][equip]" value="false" />
                                            <span class=""></span>
                                        </label>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN6}}][index]" value="6" readonly />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN6}}][id]" value="0" form-valid="int:1" />
                                    </td>
                                    <td>
                                        <input type="text" name="item[{{HTOKEN6}}][exp]" value="0" form-valid="int:0" />
                                    </td>
                                    <td>
                                        <label class="checkbox" data-old="false">
                                            <input type="hidden" name="item[{{HTOKEN6}}][equip]" value="false" />
                                            <span class=""></span>
                                        </label>
                                    </td>
                                </tr>    
                            </tbody>
                        </table>
                        <div class="btnForm">
                            <button class="hbBtn" type="submit">Save</button>
                            <button class="hbBtn popupCancel" type="button">Cancel</button>
                        </div>
                    </form>
                </div>
            </div>
        </td>
        <td>
            <a href="#" class="iconTip iconSave saveHeroInfo">
                <span>Save</span>
            </a>
            <a href="#" class="iconTip iconDelete">
                <span>Delete</span>
            </a>
        </td>
    </tr>
</script>
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
</body>
</html>
 
// TODO: Click add hero
$(document).on('click', '.addNewHero', function(){
  var content = $('#TemplateCreateNewHero').html();
​
  $(this).parent().parent().parent().parent().find('tbody').append(content);
​
  return false;
});
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
ngvcanhpro
0viewers