Workflow Sample: Episode481: Devising of "Button Input" to Input Form

"I wish I could do my input more smoothly..."

A business system is evaluated more or less by its "Operating screen". Just try to recall your day-to-day jobs, such as "Attendance report", "Decision-making request", "Contract report", "Answer to inquiry", so on... Most of the Delays and reworks that occur on these jobs are caused by "erroneous input or Inappropriate input at upstream Steps".

The following Workflow has been devised to input by clicking on the "Input sample button".

By a button being there, the concentration of inputting personnel will be sustained. Furthermore, occurrence of careless mistakes will be reduced. Even though you won't understand the advantage of "Input sample button" unless you experience, it is another input support that is different from a method of Selecting from options or Configuration of initial value. Even though it is just a button, it helps to go piled up a "sense of doing" of operators because it is their own input!?? And (something like) "CPU load" that give to the brain of the operator will drop significantly.

[Test flow for Input form]

[Test flow for Input form: "1. Input Test" screen]

A human brain is really meager.

Just by being spoken that "You dress well, today", for example, then the sentences which you are composing inside your brain will go away so easily.

Brain of a human really tends to flirt.
For example, you thought you were searching internet for "how to write an approval document", but you found yourself have stuck up in reading a Blog article of "Major trouble in approval!".

As a matter of course, you should consider "To Be" of the entire "Flow of business" (Business Process) first, when you think of the "business efficiency" of personal computer workers. However, concurrently with it, you should design and improve the input screen of respective Steps simultaneously, with a commitment (especially on the input screen of upstream Steps).

By the way, setting of arbitrary HTML/JavaScript is available to configure in [Input Hint] of Questetra. However, there also is a possibility of occurrence of trouble, such as "collapsing of the entire layout of input form". I must say it should be set by persons who have knowledge and experience of HTML/JavaScript themselves, within the range of maintainability and on self responsibility.

▼[Input Hint] Setting Example (HTML/JavaScript):"Service Item"

E.g.: <button type="button" id="btnConsultant_1">Monthly advisory fee</button>、 
<button type="button" id="btnInstruct_1">Workshop instructor fee (Diem)</button>、 
<button type="button" id="btnDoc_1">Documentation fee</button> 

<script type="text/javascript"> 
jQuery('#btnConsultant_1').on('click',function(){  
  jQuery('input[name="data\\[1\\].input"]').val( "Monthly advisory fee" ); 
});  
jQuery('#btnInstruct_1').on('click',function(){  
  jQuery('input[name="data\\[1\\].input"]').val( "Workshop instructor fee (Diem)" ); 
});  
jQuery('#btnDoc_1').on('click',function(){  
  jQuery('input[name="data\\[1\\].input"]').val( "Documentation fee" ); 
});  
</script>

▼[Input Hint] Setting Example (HTML/JavaScript):"Quotation price"

E.g.: <button type="button" id="btnS_2">(15 years career) 820,000</button>、 
<button type="button" id="btnA_2">(5 years career) 452,000</button>、 
<button type="button" id="btnB_2">(Less than 15 years) 339,000</button> 

<script type="text/javascript"> 
jQuery('#btnS_2').on('click',function(){  
  jQuery('input[name="data\\[2\\].input"]').val( "820000" ); 
});  
jQuery('#btnA_2').on('click',function(){  
  jQuery('input[name="data\\[2\\].input"]').val( "452000" ); 
});  
jQuery('#btnB_2').on('click',function(){  
  jQuery('input[name="data\\[2\\].input"]').val( "339000" ); 
});  
jQuery('input[name="data\\[2\\].input"]').parent().parent().css("background-color","#FFC0CB"); 
</script>

▼[Input Hint] Setting Example (HTML/JavaScript):"Reason for Leave"

E.g.: <button type="button" id="btn1_5">Leisure and Home matter: Private</button>、 
<button type="button" id="btn2_5">Local volunteer: Private (Local volunteer)</button>、 
<button type="button" id="btn3_5">Got abdominal pain in the morning: Illness (abdominal pain)</button>、 
<button type="button" id="btn4_5">Child's fever: Child care</button> 

<script type="text/javascript"> 
jQuery('#btn1_5').on('click',function(){  
  jQuery('input[name="data\\[5\\].input"]').val( "Private" ); 
});  
jQuery('#btn2_5').on('click',function(){  
  jQuery('input[name="data\\[5\\].input"]').val( "Private (Local volunteer)" ); 
});  
jQuery('#btn3_5').on('click',function(){  
  jQuery('input[name="data\\[5\\].input"]').val( "Illness (abdominal pain)" ); 
});  
jQuery('#btn4_5').on('click',function(){  
  jQuery('input[name="data\\[5\\].input"]').val( "Child care" ); 
});  
</script>

▼[Input Hint] Setting Example (HTML/JavaScript):"Approval request overview" "Budget classification"

Frequent: <button type="button" id="btnExhibit_78">(Exhibitions within budget)</button>、 
<button type="button" id="btnProcurement_78">(Unexpected procurement)</button> 

<script type="text/javascript"> 
jQuery('#btnExhibit_78').on('click',function(){  
  jQuery('input[name="data\\[7\\].input"]').val( "Outsourcing related to the Cloud Expo" ); 
  jQuery('input[name="data\\[8\\].selects"][value="1"]').prop('checked', true); 
});  
jQuery('#btnProcurement_78').on('click',function(){  
  jQuery('input[name="data\\[7\\].input"]').val( "Purchase of personal computers due to breakdown" ); 
  jQuery('input[name="data\\[8\\].selects"][value="3"]').prop('checked', true); 
});  
</script>

▼[Input Hint] Setting Example (HTML/JavaScript):"Reason of request"

<span style='color:#ff0000;'>* Brief in Bullet</span><br> 
E.g.: <button type="button" id="btnReasonA_9">(P.C. breakdown)</button>、 
<button type="button" id="btnReasonB_9">(Abrupt procurement due to the increase of personnel)</button>、 

<script type="text/javascript"> 
jQuery('#btnReasonA_9').on('click',function(){  
  var myReason = ""; 
  myReason += "External Monitor output is corrupted by the dropping in transportation (Dec. 2015)\n"; 
  myReason += "Hindrance to the operation of the latest OS,  past more than three years since the purchase of January 2013.\n"; 
  myReason += "Choose a familiar conventional series machine, even though D Company is not the lowest price, but the difference is small."; 
  jQuery('textarea[name="data\\[9\\].input"]').val( myReason ); 
});  
jQuery('#btnReasonB_9').on('click',function(){  
  var myReason = ""; 
  myReason += "Increase 30 part-timers to correspond due to receiving order of more than assumed.\n"; 
  myReason += "20 spare PC. Need 10 more.\n"; 
  myReason += "（D company is the cheapest and fastest.）"; 
  jQuery('textarea[name="data\\[9\\].input"]').val( myReason ); 
});  
</script>

▼[Input Hint] Setting Example (HTML/JavaScript):"Service start"

<button type="button" id="btnThisMon_11">This month</button>、 
<button type="button" id="btnNextMon_11">Next month</button> 

<script type="text/javascript"> 
jQuery('#btnThisMon_11').on('click',function(){  
  var myToday = new Date(); 
  var y = myToday.getFullYear(); 
  var m = myToday.getMonth() + 1; // Jan: 0 
  if (m < 10) { m = '0' + m; } 
  jQuery('input[name="data\\[11\\].input"]').val( y + "-" + m ); 
});  
jQuery('#btnNextMon_11').on('click',function(){  
  var myToday2 = new Date();
  myToday2.setDate(1); 
  myToday2.setMonth(myToday2.getMonth() + 1); 
  var y2 = myToday2.getFullYear(); 
  var m2 = myToday2.getMonth() + 1; // Jan: 0 
  if (m2 < 10) { m2 = '0' + m2; } 
  jQuery('input[name="data\\[11\\].input"]').val( y2 + "-" + m2 ); 
});  
</script>

▼[Input Hint] Setting Example (HTML/JavaScript):"Service end"

<button type="button" id="btnOneYear_12">→1 year cintract</button>、 
<button type="button" id="btnTwoYear_12">→2 years contract</button> 

<script type="text/javascript"> 
jQuery('#btnOneYear_12').on('click',function(){  
  var myDateStr = jQuery('input[name="data\\[11\\].input"]').val();  
  var myStartMon = new Date( myDateStr + "-01"); 
  var myEndMon = new Date(); 
  myEndMon.setMonth( myStartMon.getMonth() + 11 ); 
  var y = myEndMon.getFullYear(); 
  var m = myEndMon.getMonth() + 1; // Jan: 0 
  if (m < 10) { m = '0' + m; } 
  jQuery('input[name="data\\[12\\].input"]').val( y + "-" + m ); 
});  
jQuery('#btnTwoYear_12').on('click',function(){  
  var myDateStr = jQuery('input[name="data\\[11\\].input"]').val();  
  var myStartMon = new Date( myDateStr + "-01"); 
  var myEndMon = new Date(); 
  myEndMon.setMonth( myStartMon.getMonth() + 23 ); 
  var y = myEndMon.getFullYear(); 
  var m = myEndMon.getMonth() + 1; // Jan: 0 
  if (m < 10) { m = '0' + m; } 
  jQuery('input[name="data\\[12\\].input"]').val( y + "-" + m ); 
});  
</script>

[Data Item list]