Problem with input forms and tabs

[Rinat]

Hi!
1 script:

Code:

   $('#left_menu a').click(function()
    {
        var title = $(this).attr('title');

        if  (!$('#tabs').tabs('exists', title))
        {
            $('#tabs').tabs('add',
                {
                    title: $(this).attr('title'),
                    iconCls:  $(this).attr('data-icon'),
                    closable: true,
                    href: $(this).attr('href'),
                   cache: true
                }
            );
        }

2 script (It is loading with ajax, when tab selected) :

Code:

<div class="easyui-layout create_waybill_form" data-options="fit:true">

... 
   <table cellpadding="5" style="width: 100%">
  <tr>
<td style="width: 20%">№:</td>
<td style="width: 20%"><input class="easyui-validatebox" id = "wp_id" type="text" name="wp_id" style="width: 200px" ></td>
<td  style="width: 30%">№2 </td>
     <input id = "order_id" class="easyui-textbox" type="text" name="order_id">
</tr>
....
....
....
 <script>

            $('#wp_id').textbox({
                required: true
            });


            $('#order_id').textbox({
                required: true
            });
.....
</script>

When, I set cache:true, I have some bug.
All input forms have : width: 4px; height: 20px;
https://www.dropbox.com/s/egt2ppm1vozozzy/2015-08-03_172524.png?dl=0

[stworthy]

You forget to set the 'width' attribute on your 'order_id' field. Please set it and refresh your page again.

Code:

<input id = "order_id" class="easyui-textbox" type="text" name="order_id" style="width:200px">