Note Maker

  • (2 Pages)
  • +
  • 1
  • 2

15 Replies - 462 Views - Last Post: 01 August 2013 - 12:32 PM

#1 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Note Maker

Posted 01 August 2013 - 09:16 AM

I have a job that involves accessing customer accounts and quoting balances and other billing inquiries. I am trying to create an html tool that can be used to create notes that can be used to quote balances, service disconnect dates and so on. It basically needs a textarea with a generate note button, cut/copy button and a reset button. Below the main text area needs to be some smaller text areas where specific values can be entered then when you press "generate note", all of the fields are pasted into a single text area. If anyone could get something started on this for me it would be greatly appreciated. I have been struggling on this for months. Thanks

Is This A Good Question/Topic? 0
  • +

Replies To: Note Maker

#2 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9420
  • View blog
  • Posts: 35,399
  • Joined: 12-June 08

Re: Note Maker

Posted 01 August 2013 - 09:18 AM

Quote

If anyone could get something started on this for me it would be greatly appreciated. I have been struggling on this for months. Thanks

What have you done so far? where are you stuck?
Was This Post Helpful? 0
  • +
  • -

#3 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Re: Note Maker

Posted 01 August 2013 - 09:32 AM

This is just an simplified version of what I have now, I really just need places that I can type in balance amounts and they are also added to the "note".
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Note Maker</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function add_sub(el){
if (el.checked)
el.form.elements['type'].value+=el.value;
else{
var re=new RegExp('(.*)'+el.value+'(.*)$');
el.form.elements['type'].value=el.form.elements['type'].value.replace(re,'$1$2');
}
}
</script>
</head>
<body>

<script type="text/javascript">

function CopyToClipboard()

{


   CopiedTxt = document.selection.createRange();

   CopiedTxt.execCommand("Copy");

}

</script>

<body bgcolor="#999999">

<h2>Note Maker</h2>


<form name="form1" method=post>


<textarea name="type" rows="6" cols="30" onclick="this.focus();this.select();">
</textarea><br>

<input type="button" onclick="CopyToClipboard()" value="Copy" />
<input type="reset" value="Reset!"><br>




<Font Size="3"><b>General</b></font><br>

<font size="2">

<input type="Checkbox" name="acctnum" id="acctnum" value="Gave customer their acct #. " onclick="add_sub(this);"><label for="acctnum">Acct # Provided</label><br>

<input type="checkbox" name="inspection" id="inspection" value="Adv that inspection is required before order will be released. " onclick="add_sub(this);"><label for="inspection">Inspection Required for Service</label><br>


</font>
</form>
</body>
</html>

This post has been edited by modi123_1: 01 August 2013 - 09:36 AM
Reason for edit:: highlight the text and use the code button

Was This Post Helpful? 0
  • +
  • -

#4 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9420
  • View blog
  • Posts: 35,399
  • Joined: 12-June 08

Re: Note Maker

Posted 01 August 2013 - 09:37 AM

Okay.. so what's w rong with adding more textboxes and corresponding fields in the database that holds this?
Was This Post Helpful? 0
  • +
  • -

#5 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Re: Note Maker

Posted 01 August 2013 - 09:55 AM

I just cant get the scripting to work. To be honest I am inexperienced with this and a lot of what is making this work is things I have pieced together from other post/discussions. Right now there isn't a database for this. I have this all working off of that single html file and nothing more.
Was This Post Helpful? 0
  • +
  • -

#6 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9420
  • View blog
  • Posts: 35,399
  • Joined: 12-June 08

Re: Note Maker

Posted 01 August 2013 - 10:00 AM

Hmm.. so you do want to store this data, right? be able to recall it, edit it, print it, etc? Then you will need a database. That should be high on your list.

Quote

I just cant get the scripting to work.

I don't know what you are trying to achieve there. What should it be doing?


Quote

To be honest I am inexperienced with this and a lot of what is making this work is things I have pieced together from other post/discussions.

You should stop, regroup, and focus on the important parts. Do you have a design sketched out? Written down? GUI framed out? Then you can identify areas you need client side actions (the java script parts) and things that need server side action (php/ajax/etc) calls to store data. It wouldn't hurt to pick up a book on web programming, javascript, and some server side language.
Was This Post Helpful? 0
  • +
  • -

#7 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Re: Note Maker

Posted 01 August 2013 - 10:48 AM

That's what I will have to do. I was just hoping that it was as simple as adding javascript on top of what I already have to make it work. It doesn't have to be complex in any way. Just need to be able to copy the text from the text area on the html page then manually paste it into a program that allows me to note peoples accounts. I do this all day long in a time pressured setting. I only need 2 text areas added 1 that is for the "quoted balance" and " disconnection date" where I can type in the date and amount.

Basically I need the html page to be able to compose a small paragraph based on what I have typed in the fields or which boxes I have checked. Example, I check "gave acct #" and type the balance of $100 in Balance quote field and the information is automatically pasted together in the main textarea like this: Quoted balance of $100. Provided customer with their acct #. Its not going to be web based at all, just used right off of the desktop.

Sorry this is a mess of stuff to explain. There is no storage, database or anything. It just needs simple way for me to check certain items and enter info in certain fields and they are all consolidated into that text area for me to copy and paste locally on my computer.
Was This Post Helpful? 0
  • +
  • -

#8 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Re: Note Maker

Posted 01 August 2013 - 10:56 AM

Example

This is an example of exactly what I need except it doesn't need to be nearly this complicated. Just need a few simple fields like the balance quoted and the disc date. Doesn't even have to have the tabs.
Was This Post Helpful? 0
  • +
  • -

#9 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9420
  • View blog
  • Posts: 35,399
  • Joined: 12-June 08

Re: Note Maker

Posted 01 August 2013 - 11:06 AM

Oh.. well that is pretty different that what was explained. You need a comment formatter sort of thing. Well.. HTML probably wouldn't have been my first choice, but so it goes. What you need is just to understand how javascript events work and the DOM object to find elements.

http://www.w3schools...m_obj_event.asp
http://coding.smashi...esponding-user/
https://developer.mo...s/Web/API/Event
Was This Post Helpful? 0
  • +
  • -

#10 BetaWar  Icon User is online

  • #include "soul.h"
  • member icon

Reputation: 1167
  • View blog
  • Posts: 7,216
  • Joined: 07-September 06

Re: Note Maker

Posted 01 August 2013 - 11:12 AM

If you are interested, there is a piece of open source code out there called zenpen which (at least in the demo) appears to do most of what you are looking for. It allows (by the demo) for you to have multiple input areas (a title and content) and use basic rich text editing capabilities (copy, paste, bold, underline, italic, maybe more). So with some slight modification I believe you can get it to have more inputs and dump everything to a single textarea.

Hope that's of use.
Was This Post Helpful? 0
  • +
  • -

#11 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9420
  • View blog
  • Posts: 35,399
  • Joined: 12-June 08

Re: Note Maker

Posted 01 August 2013 - 11:35 AM

It shouldn't be that hard to repeatedly use the DOM's getElementById, a onclick event, and maybe some basic if statements.

Example:

<!DOCTYPE html>
<html>
<head>
    <script>

        //a simple method that fires off each time the button is clicked.
        function FormatClicked()
        {
            /*declare a variable to get the value of the silly check box
            *   What is happenign here is the document is being searched for that unique name.  When the ID is found we know it is a checkbox and try to find the true/false state of it.
            */
            var isRedChecked = document.getElementById("chkSilly").checked;
            var isSillyChecked = document.getElementById("chkRed").checked;

            //using the same principle of finding the DOM object - we can pull the text value (or text contenet) from the  input textbox
            var allInput = document.getElementById("txtInput").textContent;

            // a basic if statement determines what to add to the input string to make it more cool (based on the checkboxes)
            if (isRedChecked)
            {
                allInput += " a red Ball!";
            }

            if (isSillyChecked)
            {
                allInput += " a silly goose!";
            }

            // when done we find our output textbox and shove the newly (and conditionally) formated text into it!
            document.getElementById("txtOutput").textContent = allInput;

        }

    </script>
</head>
<body>

    <!--generic text box-->
    <textarea id="txtInput" style="width: 400px; height: 150px;">  </textarea>
    <br />
    <!--since checkboxes are only found in forms, wrap them -->
    <!--the key here is the id.. make sure that is unique because you'll need to find that later-->
    <form>
        Red:<input type="checkbox" id="chkRed" /><br />
        Silly:
        <input type="checkbox" id="chkSilly" /><br />
    </form>
    <br /><br />
    <!--buttons have events.. one of those events (onclick) goes to the javascript function you tell it when it is clicked.-->
    <button id="btnFormat" onclick="FormatClicked()">Format</button>
    <br />    <br />   <hr />    <br />    <br />
    <textarea id="txtOutput" style="width: 400px; height: 150px;">  </textarea>

</body>
</html>


Was This Post Helpful? 0
  • +
  • -

#12 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Re: Note Maker

Posted 01 August 2013 - 12:13 PM

View Postespltdcold, on 01 August 2013 - 09:32 AM, said:

This is just an simplified version of what I have now, I really just need places that I can type in balance amounts and they are also added to the "note".
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Note Maker</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function add_sub(el){
if (el.checked)
el.form.elements['type'].value+=el.value;
else{
var re=new RegExp('(.*)'+el.value+'(.*)$');
el.form.elements['type'].value=el.form.elements['type'].value.replace(re,'$1$2');
}
}
</script>
</head>
<body>

<script type="text/javascript">

function CopyToClipboard()

{


   CopiedTxt = document.selection.createRange();

   CopiedTxt.execCommand("Copy");

}

</script>

<body bgcolor="#999999">

<h2>Note Maker</h2>


<form name="form1" method=post>


<textarea name="type" rows="6" cols="30" onclick="this.focus();this.select();">
</textarea><br>

<input type="button" onclick="CopyToClipboard()" value="Copy" />
<input type="reset" value="Reset!"><br>




<Font Size="3"><b>General</b></font><br>

<font size="2">

<input type="Checkbox" name="acctnum" id="acctnum" value="Gave customer their acct #. " onclick="add_sub(this);"><label for="acctnum">Acct # Provided</label><br>

<input type="checkbox" name="inspection" id="inspection" value="Adv that inspection is required before order will be released. " onclick="add_sub(this);"><label for="inspection">Inspection Required for Service</label><br>


</font>
</form>
</body>
</html>


Maybe its just me but I tried this and it doesn't seem to be working. Is this supposed to actually function correctly as is or is it just an example of the type of script to use?

Maybe its just me but I tried this and it doesn't seem to be working. Is this supposed to actually function correctly as is or is it just an example of the type of script to use?
Was This Post Helpful? 0
  • +
  • -

#13 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Re: Note Maker

Posted 01 August 2013 - 12:22 PM

Sorry I didn't mean to quote myself. mmodi123_1 I was referring to your post a few minutes ago.
Was This Post Helpful? 0
  • +
  • -

#14 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9420
  • View blog
  • Posts: 35,399
  • Joined: 12-June 08

Re: Note Maker

Posted 01 August 2013 - 12:24 PM

Yes.. that code works fine when ran off any desktop with safari, ie, or FF.
Was This Post Helpful? 0
  • +
  • -

#15 espltdcold  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 11
  • Joined: 01-August 13

Re: Note Maker

Posted 01 August 2013 - 12:29 PM

You mentioned earlier that HTML isn't your first choice for this and I agree with you there but what would be better? Trying to just make an application or is that even harder to learn?
Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2