How would I write this function?

What follows is a single challenge, but some "comments" that I've thrown in in an attempt to understand why it works and not just that it works. Not that I've got it working, but I want to do more than copy and paste.

Here's what I've got:

<td width='78' $rclass><span class='info'><div id='comparison_$i' style='color:#656363;'>&nbsp;".$allocatedlist[$i]["totalcost"]."</div></span></td>
                    <td width='75' $rclass><span class='info'><input type='text' size='10' class='cer' name='allocated' value='".$allocatedlist[$i]["totalcost"]."' 
                    onchange='visibility(\"$i\", \"."$allocatedlist[$i]["totalcost"]".\", );'></span><!-- hidden field in order to facility comparison of what's available to what user is documenting --><input type='hidden' value='".$allocatedlist[$i]["totalcost"]."' name='total_cost_comparison' id='total_cost_comparison_$i'></td>
                    <td width='20' $rclass>&nbsp;<div id='save_$i' style='visibility:hidden; display:inline; vertical-align:center;'>
                    <a href='capx.php?cm=change&appliedcapxid$i=".$allocatedlist[$i]["cercapxid"]."'><img src='images/save_icon.gif' width='15' border='0'></a></div> 

Open in new window


If you look at the Word doc that I have attached, you'll "see" what I'm trying to do (forgive the dual screen thing. It's the screen on the right that you want to be looking at).

So my user access the first screen and he's given the option of changing the values in the text field. Right now I have a script that's activate on the "onchange" event in that a little "save" icon pops up. You see that in the JavaScript that I've got here:

function visibility(row, user_cost, total_cost) {
    eval('document.getElementById(\'save_'+row+'\').style.visibility = \'visible\';');
    eval('user_total = window.parent.dataform.'+item+'id.value;');
    eval('document.getElementById(\'comparison_'+row+'\').style.color = \'red\';')  
}

What I need to have happen is that when the user makes the mistake of inputting a dollar amount that is greater than the value in the hidden "total_cost_comparison" field, the value in the "comparison$i" cell becomes red.

I've been studying what's been done with these kinds of situations before on the project that I'm working on and I want to honor their convention. Here's an example of something similar...

        function addtolist(item, id, name) {
      eval('checkid = window.parent.dataform.'+item+'id.value;'); //grab the value that's been passed via php into a JavaScript zone so I can make some comparisons
      eval('checkname = window.parent.dataform.'+item+'.value;');
      if (checkid != '') //make my comparison
            {
            checkid = checkid+', '+id; // do something
            checkname = checkname+'; '+name;
            }
      else
            {
            checkid = id;
            checkname = name;
            }
      eval('objid = parent.document.dataform.'+item+'id;');
      objid.value = checkid;
      eval('objname = parent.document.dataform.'+item+';');
      objname.value = checkname;
      eval('objdispname = parent.'+item+'name;');
      objdispname.innerHTML = checkname;
      

How can I check to see what the user has entered and compare that to the allocated amount in a way where if they exceed the allocated amount, the dollar amount is displayed in red?
brucegustPHP DeveloperAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

RobOwner (Aidellio)Commented:
I'll look in more depth but the "eval()" jumps out at me.  Is this legacy code you're trying to maintain or was there a reason to use it? It's obsolete and a security risk so it would be worth your while to get rid of it if you can
0
Michel PlungjanIT ExpertCommented:
Your evals are hideous and unnecessary

You may mean this

function visibility(row, user_cost, total_cost) {
  document.getElementById('save_'+row).style.visibility = 'visible';
  var user_total = parseFloat(parent.dataform.elements[item+'id'].value);
  var comp = parseFloat(parent.dataform.total_cost_comparison.value);
  document.getElementById("comparison_"+row).style.color = user_total>comp?"red":"white";
}

Open in new window

0
Slick812Commented:
greetings brucegust, The javascript you give is not at all effective for this kind of thing (my opinion), for instance you turn the max display to red if it goes OVER, but do not change it back if it is corrected to lower, a bad GUI. The user_cost, and the total_cost are never used in the function, Why are they there?

You can send the input to check in the onchange function with "this", a much better approach.

here is my suggestion -
<script>
function checkVal(row, inpt) {
  document.getElementById("save_"+row).style.visibility = "visible";
  var newValue = parseFloat(inpt.value);
  var maxValue = parseFloat(document.getElementById("total_cost_comparison"+row).value);
  if (newValue <= maxValue)
    document.getElementById("comparison_"+row).style.color = "#656363";
    else
    document.getElementById("comparison_"+row).style.color = "red";
}
</script>

<input type='text' size='10' class='cer' name='allocated' value='33.33' 
   onchange='checkVal(8, this);' />

Open in new window

The input above does not have the PHP just to show the html, but you need to have the 8 in function parameters replaced with the $i of the PHP,
Maybe I do not exactly GET what needs to be done, but this may work, or help.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

brucegustPHP DeveloperAuthor Commented:
Thanks, folks!

I was able to get it working and I feel obligated to use the current infrastructure just because I'm part of a team dynamic and therefore a "guest" more so than someone who can just start flying solo.

Here's where I landed:

function show_visibility(form,row) {
//alert (row);
    eval('comparison = form.total_cost_comparison_'+row+'.value;');
    eval('user_value = form.allocated_'+row+'.value;');
    if(user_value>comparison)
    {
    eval('document.getElementById(\'view_comparison_'+row+'\').style.color = \'red\';')  
    alert("Your allocated amount cannot exceed what's been budgeted.");
    }
    else
    {
        eval('document.getElementById(\'view_comparison_'+row+'\').style.color = \'#656363\';')  
        eval('document.getElementById(\'save_'+row+'\').style.visibility = \'visible\';');
    }
}

Nice and simple, but I will look into the "eval" dynamic and try to better understand why some perceive it as a poison.

BTW: I have another dilemma and would welcome your insight. Take a look at http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28380916.html
0
Slick812Commented:
it uses a BAD javascript call as -
eval('user_value = form.allocated_'+row+'.value;');

I feel that the -
user_value = getElementsByName("allocated_"+row)[0].value;

is better and correct javascript,
since the project is full of eval( ) any way, it's no use to change just your code section to not use eval( )
0
brucegustPHP DeveloperAuthor Commented:
Understood.

Thanks!

Would welcome your time and input on another JavaScript challenge at http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28380916.html

Thanks again, Slick!
0
Michel PlungjanIT ExpertCommented:
I strongly recommend refactoring all evals. They are unnecessary, can be a security risk and inefficient

function show_visibility(form,row) {
    var comparison = parseInt(form["total_cost_comparison_"+row].value,10);
    var user_value = parseInt(form["allocated_"+row].value,10);
    var isGreater = user_value>comparison;
    document.getElementById("view_comparison_"+row).style.color = isGreater?"red":"#656363";
    document.getElementById("save_"+row).style.visibility = isGreater?"visible":"hidden";

    if (isGreater) {
      alert("Your allocated amount cannot exceed what's been budgeted.");
    }
}

Open in new window

0
Slick812Commented:
I agree wid mplungjan to a point, and you have definitely crossed the line when you place an alert( ); in an eval("alert( 'ok');") as you did in the -
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28380916.html

I know that the reason for the eval( ) was the inability to write -
form.total_cost_comparison_+row+.value;
    and have it work in JS, but it can work in an eval()

you can not just keep compounding the crap JS code, but I know that if you are working for someone they make the rules, BUT bad code has got to stop somewhere.
Sorry, about my over generalized saying of "it's no use to change just your code section to not use eval( ) "
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.