Bootstrap framework snippet dismiss input field

This bootstrap framework snippet "dismiss input field" was designed to help people of all skill levels - designer or developer,
huge nerd or early beginner. copy and paste the code. Use it as a complete kit or use it to start something more complex.
tags: input,field

<div class="container bootstrap snippet"> <div class="row"> <div class="col-lg-6 col-lg-offset-3"> <label for="">Please write something and click go</label> </div> <div class="input-group col-lg-6 col-lg-offset-3"> <input type="text" class="form-control" id="cyrillic-input"> <span class="input-group-btn"> <button class="btn btn-default" id="go-btn" type="button">Go!</button> </span> </div><!-- /input-group --> <div class="col-lg-6 col-lg-offset-3"> <h4 id="utf-result">result:</h4> </div><!-- /.col-lg-6 .col-lg-offset-3 --> <div class="col-lg-3"> </div><!-- /.col-lg-3 --> <div class="col-lg-6 col-lg-offset-3"> <img class="thumbnail img-responsive" id="dumy-img" src=";" title=";text="> </div><!-- /.col-lg-6 .col-lg-offset-3 --> <div class="col-lg-3"> </div><!-- /.col-lg-3 --> </div><!-- /.row --> </div><!-- /.container -->
$('#go-btn').click(function () { var btn = $(this); var input = $("#cyrillic-input").val(); input = encodeURIComponent(input); var utf = input.replace(new RegExp("%",'g'), "0x"); $('#utf-result').text(utf); var dummyImage = $('#dumy-img'); dummyImage.attr("src",dummyImage.attr("title") + utf); });

Creator of this snippet

Dey Dey

Bootstrap version: 3.1.1

Created: May 24th 2014, 00:42

Views: 2.2K