Issue while store the javascript textbox value into DB using ajax code in MVC2

Question

I may be missing something obvious here, but how could I rewrite this code!

i am trying here to store the value entered in the textbox(Textbox was showed in javascript dialog page).In a javascript dialog page i have one 'ok' button.. when i click the button i want to store the value entered in the textbox.I want to save the content using Ajax.

Please see my sample code View page:

<script language="javascript" type="text/javascript">
    $(function () {
        $('.button').live('click', function () {
            $('.Text_dialog').dialog('open');
        });

        $('.Text_dialog').dialog({
            autoOpen: false,
            buttons: {
                'Ok': function () {
                    var textValue = $(':txtValue').val();
                    $.ajax({
                        url: '/Home/About',
                        type: 'POST',
                        data: { str: textValue },
                        success: function (result) {
                            alert(result.val);
                        }
                    });
                },
            }
        });
    });

</script>


     <input type="button" value="Add Value" class="button" />
     <div class="Text_dialog" title="Basic modal dialog">
          TextValue: <input type="text" class="txtValue" />
</div>

Control page:

[HttpPost]
    public ActionResult About(string str)
    {
        ValidateClass ObjAM = new ValidateClass();
        int value = ObjAM.ValidatetextValue(str);
        return Json(new { val = value });
    }

Model page:

 public class ValidateClass
    {
        DataClasses1DataContext dbObj = new DataClasses1DataContext();
        public int ValidatetextValue(string str)
        {
            string value = (from SearchtextValue in dbObj.Options
                                where SearchtextValue.OptionName == str
                                select SearchtextValue.OptionName).Single();
            if (value == null)
            {
                return 1;
            }
            return 0;

        }
    }

When i run this code i am getting script error like "Object doesn't support this property or method".Please advice

codeandcloud · Accepted Answer · 2011-07-22 09:03:34Z

0

Change ~~data: { str: textValue }~~ to data: "{ 'str' :'" + textValue +"' }"

If you are confused on escaping the quotes properly, try this.

$(function() {
    $('.button').live('click', function() {
        $('.Text_dialog').dialog('open');
    });

    $('.Text_dialog').dialog({
        autoOpen: false,
        buttons: {
            'Ok': function() {
                var DTO = "{ 'str' :'" + $('.txtValue').val() +"' }";
                $.ajax({
                    url: '/Home/About',
                    type: 'POST',
                    data: DTO,
                    success: function(result) {
                        alert(result.val);
                    }
                });
            },
        }
    });
});

Please note that I have changed the ~~:txtValue~~ to .txtValue as it is the correct selector.

edited Jul 22, 2011 at 9:03

answered Jul 22, 2011 at 8:35

codeandcloud

55.6k47 gold badges169 silver badges259 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Dhana Over a year ago

I am getting issue when page loading it self like 'type' is undefined.. Please help

codeandcloud Over a year ago

be careful with the quotes. and make sure there are commas intact

Dhana Over a year ago

Code is working fine.. but null value is exists to my control page instead of string which i enter in the textbox..

codeandcloud Over a year ago

@Dhana: are you using .txtValue instead of colon

Dhana Over a year ago

yes.. Please find my code here var txtValue = "{ 'str' :'" + $('#txt1').val() + "' }"; $.ajax({ url: '/Home/About', type: 'POST', dataType: "json", data: txtValue, success: function (result) { alert(result.val); } });

Mihai Popescu · Accepted Answer · 2011-07-22 09:29:07Z

0

can you try changing

<input type="text" class="txtValue" />

to

<input type="text" class="txtValue" id="txtValue" />

and

var textValue = $(':txtValue').val();

to

var textValue = $('#txtValue').val();

I've never used : selector... but I think it will return you a collection and you should use index [0] or, why don't you use class selector .?

Edit: as I see you cannot use : in this case

also you can add dataType: "json",into your Ajax request, and change your method return type from

public ActionResult About(string str)

to

public JsonResult About(string str)

EDIT 2:

have you included the library where dialog() function is? after including the jquery library?

edited Jul 22, 2011 at 9:29

answered Jul 22, 2011 at 8:47

Mihai Popescu

1157 bronze badges

3 Comments

Dhana Over a year ago

Yes i have added the Lib file after the JQ lib

Dhana Over a year ago

Code is working fine.. but null value is exists to my control page instead of string which i enter in the textbox..Please advice

Mihai Popescu Over a year ago

you should leave it as it was... data: { str: textValue } ,this is the right way, in this waz you are sending an object that will be deserialized with request and serialized with the same name, at the server side...

Collectives™ on Stack Overflow

Issue while store the javascript textbox value into DB using ajax code in MVC2

2 Answers 2

5 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related