0

I have something like simple MS Windows Calculator in ASP.NET MVC 4. Now I don't know how to send expression like 4+5 to the Model for example to public string Expression { get; set }. Then I want parse this expression and calculate it but how to do it?

I have Controller:

public class CalculatorController : Controller
{
    //
    // GET: /Calculator/
    public ActionResult Index()
    {
        return View();
    }
    //GET: /Calculator/Calculate
    [HttpGet]
    public ActionResult Calculate(Calculator model)
    {

        return View(model);
    }
    //POST
    [HttpPost]
    public ActionResult Calculate()
    {
        Calculator model = new Calculator();
        return View(model);
    }
}

I have Model:

public class Calculator
{
    public string Expression { get; set; }
    public double Result { get; set; }
}

And I have View with Razor and JavaScript:

@using (Html.BeginForm("Calculate", "Calculator", FormMethod.Post)){    
@Html.LabelFor(model => model.Expression)
@Html.TextBoxFor(model => model.Expression)    
        <table>
            <tr>
                <td><input type="button" name="btnSeven" id="btnSeven" value="7" /></td>
                <td><input type="button" id="btnEight" value="8" /></td>
                <td><input type="button" id="btnNine" value="9" /></td>
                <td><input type="button" id="btnDelete" value="DEL" /></td>
                <td><input type="button" id="btnClear" value="CLR" /></td>
            </tr>
            <tr>
                <td><input type="button" id="btnFour" value="4" /></td>
                <td><input type="button" id="btnFive" value="5" /></td>
                <td><input type="button" id="btnSix" value="6" /></td>
                <td><input type="button" id="btnMultiply" value="*" /></td>
                <td><input type="button" id="btnDivide" value="/" /></td>
            </tr>
            <tr>
                <td><input type="button" id="btnOne" value="1" /></td>
                <td><input type="button" id="btnTwo" value="2" /></td>
                <td><input type="button" id="btnThree" value="3" /></td>
                <td><input type="button" id="btnPlus" value="+" /></td>
                <td><input type="button" id="btnMinus" value="-" /></td>
            </tr>
            <tr>
                <td><input type="button" id="btnZero" value="0" /></td>
                <td><input type="button" id="btnDot" value="." /></td>
                <td><input type="submit" id="btnEqual" value="=" /></td>
                @Html.ValueFor(model => model.Expression)
                <td><input type="button" id="btnLBracket" value="(" /></td>
                <td><input type="button" id="btnRBracket" value=")" /></td>
            </tr>
        </table> 

}

JavaScript in the same View:

<script>
            window.onload = function () {
                document.getElementById('btnSeven').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnSeven').value;
                });
                document.getElementById('btnEight').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnEight').value;
                });
                document.getElementById('btnNine').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnNine').value;
                });
                document.getElementById('btnDelete').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnDelete').value;
                });
                document.getElementById('btnClear').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnClear').value;
                });
                document.getElementById('btnFour').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnFour').value;
                });
                document.getElementById('btnFive').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnFive').value;
                });
                document.getElementById('btnSix').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnSix').value;
                });
                document.getElementById('btnMultiply').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnMultiply').value;
                });
                document.getElementById('btnDivide').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnDivide').value;
                });
                document.getElementById('btnOne').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnOne').value;
                });
                document.getElementById('btnTwo').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnTwo').value;
                });
                document.getElementById('btnThree').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnThree').value;
                });
                document.getElementById('btnPlus').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnPlus').value;
                });
                document.getElementById('btnMinus').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnMinus').value;
                });
                document.getElementById('btnZero').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnZero').value;
                });
                document.getElementById('btnDot').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnDot').value;
                });
                @*document.getElementById('btnEqual').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnEqual').value;
                });*@
                document.getElementById('btnLBracket').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnLBracket').value;
                });
                document.getElementById('btnRBracket').addEventListener('click', function () {
                    document.getElementById('Expression').value = document.getElementById('Expression').value + document.getElementById('btnRBracket').value;
                });
            }

How to send expression to Expression then parse and calculate and send to Result and then send to the textBox. Everything must be done in the same textBox after click on = button.

4

0 回答 0