JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap-editable/css/bootstrap-editable.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap-editable/js/bootstrap-editable.js"></script>
<div id="user">
    <a href="#" id="cust_name" data-type="text" data-pk="1001" title="Enter customer name">John Smith</a>
    <a href="#" id="cust_addr" data-type="text" data-pk="1001" title="Enter customer address">123 Main Street</a>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" id="ResetButton">Reset</button>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-primary" id="SaveButton" data-dismiss="modal">Save changes</button>
    </div>
</div>

JavaScript

$('#user a').editable({
    mode: 'inline'
});

$('#ResetButton').on('click', function(e){
     $('#user a').editable('setValue', null);
});