Search Results

Search found 435 results on 18 pages for 'onchange'.

Page 16/18 | < Previous Page | 12 13 14 15 16 17 18  | Next Page >

  • problem with select boxes - second options based on first selection

    - by Charles Marsh
    Hello All, I just posted a question about opening in a new window but if I use window.location it doesn't work?? is there a problem with my javascript? <script type="text/javascript"> function setOptions(chosen){ var selbox = document.formName.table; selbox.options.length = 0; if (chosen == " ") { selbox.options[selbox.options.length] = new Option('No diploma selected',' '); } if (chosen == "1") { selbox.options[selbox.options.length] = new Option('first choice - option one','http://www.pitman-training.com'); selbox.options[selbox.options.length] = new Option('first choice - option two','onetwo'); } if (chosen == "2") { selbox.options[selbox.options.length] = new Option('second choice - option one','twoone'); selbox.options[selbox.options.length] = new Option('second choice - option two','twotwo'); selbox.options[selbox.options.length] = new Option('second choice - option three','twothree'); selbox.options[selbox.options.length] = new Option('second choice - option four','twofour'); } if (chosen == "3") { selbox.options[selbox.options.length] = new Option('third choice - option one','threeone'); selbox.options[selbox.options.length] = new Option('third choice - option two','threetwo'); } } </script> Its a little messy I know... <form name="formName" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>"> <select name="optone" size="1" onchange="setOptions(document.formName.optone.options[document.formName.optone.selectedIndex].value);"> <option value=" " selected="selected">Please select a diploma</option> <option value="1">First Choice</option> <option value="2">Second Choice</option> <option value="3">Third Choice</option> </select> <select name="table" size="1" > <option value=" " selected="selected">No diploma selected</option> </select> <input type="submit" onclick="ob=this.form.table;window.location(ob.options[ob.selectedIndex].value)"/> </form> to be honest I'm not happy with this anyway I want a way to hide the Submit button until the second selected box has been selected...but I'm no java expert! Can anyone point me in the right direction?

    Read the article

  • displaying the values in textbox based on AJAX fetched entries

    - by Anurag
    hello, I've a table in which addition rows can be generatred as per the user need by clicking a javascript function. Each row has a drop down list, and based on the values of this an AJAX script fetchs some values which has to be displayed in corresponding textfields of the same row.. here is the code for HTML.. <td><div align="center"> <label> <select name="gcno1" id="gcno1" onchange="fetch_gc(this)"> <option value="0">NIL</option> <option value="2">1</option> <?php while($row=mysql_fetch_array($result)) { ?> <option value="<?php echo $row[0]; ?>"><?php echo $row[0]; ?></option> <?php }?> </select> </label> </div></td> <td><div align="center"><input name="date1" id="date1" type="text" size="10" /> </div></td> and here is the AJAX which I'm writing... xmlhttp = new XMLHttpRequest(); var value=encodeURIComponent(document.getElementById('gcno1').value); var parameters="param1="+value; xmlhttp.open("POST", 'fetch_gc.php', true); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlhttp.send(parameters); xmlhttp.onreadystatechange=function(){ if(xmlhttp.readyState == 4 && xmlhttp.status == 200) { var detail=xmlhttp.responseText.split('+'); alert(detail[0]); document.getElementsByName('date1').value=String(detail[0]); alert("life " + document.getElementById('gcno1').value); } } The alert inside the AJAX shows the correct response text, detail[0] but is unable to put the value in corresponding textbox i.e. with name 'gcno1'...... Please help me with this problem...

    Read the article

  • please help me to find out where i am doing mistake in this code? i wnat retieve the value that i am

    - by user309381
    function reload(form) { var val = $('seltab').getValue(); new Ajax.Request('Website.php?cat=' +escape(val), { method:'get', onSuccess: function(transport){ var response = transport.responseText ; $("MyDivDB").innerHTML = transport.responseText ; alert("Success! \n\n" + response); }, onFailure: function(){ alert('Something went wrong...') } }); } </script> </head> title author pages $con = mysql_connect($dbhostname,$dbuserid,$dbpassword); if(!$con) { die ("connection failed".mysql_error()); } $db = mysql_select_db($dbname,$con); if(!$db) { die("Database is not selected".mysql_error()); } $query ="SELECT * FROM books NATURAL JOIN authors" ; $result = mysql_query($query); if(!$query) { die("Database is not query".mysql_error()); } while($row = mysql_fetch_array($result,MYSQL_ASSOC)) { $title = $row["title"]; $author = $row["author"]; $page = $row["pages"]; echo "<tr>"; echo "<td>$title</td>"; echo "<td>$author</td>"; echo "<td>$page</td>"; echo "</tr>"; } print "</table>"; echo "<select id = seltab onchange = 'reload(this.form)'>"; $querysel = "SELECT title_id,author FROM authors NATURAL JOIN books"; $result1 = mysql_query($querysel) ; while($rowID = mysql_fetch_assoc($result1)) { $TitleID = $rowID['title_id']; $author = $rowID['author']; print "<option value = $author>$author\n"; print "</option>"; } print "</select>"; ? Wbsite.php

    Read the article

  • Mootools 1.2.4 delegation not working in IE8...?

    - by michael
    Hey there everybody-- So I have a listbox next to a form. When the user clicks an option in the select box, I make a request for the related data, returned in a JSON object, which gets put into the form elements. When the form is saved, the request goes thru and the listbox is rebuilt with the updated data. Since it's being rebuilt I'm trying to use delegation on the listbox's parent div for the onchange code. The trouble I'm having is with IE8 (big shock) not firing the delegated event. I have the following HTML: <div id="listwrapper" class="span-10 append-1 last"> <select id="list" name="list" size="20"> <option value="86">Adrian Franklin</option> <option value="16">Adrian McCorvey</option> <option value="196">Virginia Thomas</option> </select> </div> and the following script to go with it: window.addEvent('domready', function() { var jsonreq = new Request.JSON(); $('listwrapper').addEvent('change:relay(select)', function(e) { alert('this doesn't fire in IE8'); e.stop(); var status= $('statuswrapper').empty().addClass('ajax-loading'); jsonreq.options.url = 'de_getformdata.php'; jsonreq.options.method = 'post'; jsonreq.options.data = {'getlist':'<?php echo $getlist ?>','pkey':$('list').value}; jsonreq.onSuccess = function(rObj, rTxt) { status.removeClass('ajax-loading'); for (key in rObj) { status.set('html','You are currently editing '+rObj['cname']); if ($chk($(key))) $(key).value = rObj[key]; } $('lalsoaccomp-yes').set('checked',(($('naccompkey').value > 0)?'true':'false')); $('lalsoaccomp-no').set('checked',(($('naccompkey').value > 0)?'false':'true')); } jsonreq.send(); }); }); (I took out a bit of unrelated stuff). So this all works as expected in firefox, but IE8 refuses to fire the delegated change event on the select element. If I attach the change function directly to the select, then it works just fine. Am I missing something? Does IE8 just not like the :relay? Sidenote: I'm very new to mootools and javascripting, etc, so if there's something that can be improved code-wise, please let me know too.. Thanks!

    Read the article

  • set/unset checkboxes in JSF

    - by mykola
    Hello, i've got one problem with checkboxes in JSF. I want them to behave dependently on each other, e.g., when i check a box which belongs to some object that has children then all checkboxes that belong to these children components must be checked either. And also when i uncheck one of child's checkbox the parent should be unchecked too. It's pretty simple with plain HTML/javascript, but i can't do anything with this under JSF. For some reason i can't set ID's for them because all checkboxes are rendered dynamically in a treetable and it prevents me from setting my own ID's, i.e. whatever i set in ID property only constant part will apply, all dynamic data that i pass is ignored. I tried to do it through valueChangeListener or validator but in both cases after i set needed values something sets them back! I don't know who does it and i can't do anything with this. Here's some code (i use OpenFaces treeTable): <o:treeTable id="instTreeTable" var="inst" ...> <...> <o:column id="isGranted" width="10%"> <f:facet name="header"> <h:outputText value="#{msg.access_granted}" /> </f:facet> <h:selectBooleanCheckbox value="#{inst.assignedToUser}" styleClass="treeTableText" valueChangeListener="#{MbUserInstitutions.onAccessGrantedChanged}" > <a4j:support event="onchange" reRender="instTreeTable"/> </h:selectBooleanCheckbox> </o:column> <...> </o:treeTable> MbUserInstitutions: public void onAccessGrantedChanged(ValueChangeEvent event) { Boolean granted = (Boolean) event.getNewValue(); Institution inst = getInstitution(); if (granted.booleanValue() && inst.hasChildren()) { setChildrenInsts(inst); } else if (!granted.booleanValue() && inst.getParentId() != null){ unsetParentInst(inst); } } private Institution getInstitution() { return (Institution) Faces.var("inst"); } private void setChildrenInsts(Institution parent) { for (Institution child: parent.getChildren()) { child.setAssignedToUser(true); if (child.hasChildren()) { setChildrenInsts(child); } } } private void unsetParentInst(Institution child) { child.setAssignedToUser(false); for (Institution inst: coreInsts) { if (inst.getId().equals(child.getParentId())) { unsetParentInst(inst); break; } } }

    Read the article

  • disabling dropdownlist inside a gridview based on value selected on another dropdownlist inside the gridview from javascript or jquery

    - by Joy
    what i m trying is i hav two dropdownlists inside the gridview... namely say ddonsiteoffsite and ddhours... now what i want is if the selectedtext of ddonsiteoffsite is "onsite" the ddhours should b disabled... i tried the code snippet but ... its not disabling the ddhours... can someone help me please.. <asp:TemplateColumn HeaderText=" OnSite/OffSite" > <ItemTemplate> <asp:DropDownList ID="ddOnsiteOffside" runat="server" onchange="ToggleOnOff(this)"><asp:ListItem Text = "Offsite" Value="Offsite"></asp:ListItem> <asp:ListItem Text = "Onsite" Value="Onsite"></asp:ListItem> </asp:DropDownList> </ItemTemplate> </asp:TemplateColumn> <asp:TemplateColumn> <ItemTemplate> <asp:DropDownList ID="ddhours" runat="server"> <asp:ListItem Text = "1" Value="1" ></asp:ListItem> <asp:ListItem Text = "2" Value="2" ></asp:ListItem> <asp:ListItem Text = "3" Value="3" ></asp:ListItem> <asp:ListItem Text = "4" Value="4" ></asp:ListItem> <asp:ListItem Text = "5" Value="5" ></asp:ListItem> <asp:ListItem Text = "6" Value="6" ></asp:ListItem> <asp:ListItem Text = "7" Value="7" ></asp:ListItem> <asp:ListItem Text = "8" Value="8" ></asp:ListItem> <asp:ListItem Text = "9" Value="9" ></asp:ListItem> </asp:DropDownList> </ItemTemplate> </asp:TemplateColumn> and the corresponding javascript i am using is : enter code here function ToggleOnOff(ddonoff) { var row = chk.parentNode.parentNode; if(ddonoff.value=="Onsite") { row.getElementsByTagName("ddhours")[0].disabled = true; } else row.getElementsByTagName("ddhours")[0].disabled = false; } can someone help to achieve this ?? using javascript or jquery ? i m not understanding where i went wrong ...

    Read the article

  • ajaxSubmit and Other Code. Can someone help me determine what this code is doing?

    - by Matt Dawdy
    I've inherited some code that I need to debug. It isn't working at present. My task is to get it to work. No other requirements have been given to me. No, this isn't homework, this is a maintenance nightmare job. ASP.Net (framework 3.5), C#, jQury 1.4.2. This project makes heavy use of jQuery and AJAX. There is a drop down on a page that, when an item is chosen, is supposed to add that item (it's a user) to an object in the database. To accomplish this, the previous programmer first, on page load, dynamically loads the entire page through AJAX. To do this, he's got 5 div's, and each one is loaded from a jquery call to a different full page in the website. Somehow, the HTML and BODY and all the other stuff is stripped out and the contents of the div are loaded with the content of the aspx page. Which seems incredibly wrong to me since it relies on the browser to magically strip out html, head, body, form tags and merge with the existing html head body form tags. Also, as the "content" page is returned as a string, the previous programmer has this code running on it before it is appended to the div: function CleanupResponseText(responseText, uniqueName) { responseText = responseText.replace("theForm.submit();", "SubmitSubForm(theForm, $(theForm).parent());"); responseText = responseText.replace(new RegExp("theForm", "g"), uniqueName); responseText = responseText.replace(new RegExp("doPostBack", "g"), "doPostBack" + uniqueName); return responseText; } When the dropdown itself fires it's onchange event, here is the code that gets fired: function SubmitSubForm(form, container) { //ShowLoading(container); $(form).ajaxSubmit( { url: $(form).attr("action"), success: function(responseText) { $(container).html(CleanupResponseText(responseText, form.id)); $("form", container).css("margin-top", "0").css("padding-top", "0"); //HideLoading(container); } } ); } This blows up in IE, with the message that "Microsoft JScript runtime error: Object doesn't support this property or method" -- which, I think, has to be that $(form).ajaxSubmit method doesn't exist. What is this code really trying to do? I am so turned around right now that I think my only option is to scrap everything and start over. But I'd rather not do that unless necessary. Is this code good? Is it working against .Net, and is that why we are having issues?

    Read the article

  • disable dates using jquery inside gridview control

    - by bladerunner
    Hi there, I have a gridview which contains a textbox control. I need to show the calendar for the user to pick the date and certain dates are to be disabled using jquery. I found a post on stackoverflow that talked about how to disable certain dates. I am done with that part, except not sure how to pass the textbox control to this jquery function. Here is the code. <script type="text/javascript" language="javascript"> function pageLoad(sender, args) { var enabledDays = ['09/21/2011', '10/05/2011', '10/19/2011', '11/02/2011', '11/16/2011']; /* utility functions */ function editDays(date) { for (var i = 0; i < enabledDays.length; i++) { if (new Date(enabledDays[i]).toString() == date.toString()) { return [true]; } } return [false]; } /* create datepicker */ $(document).ready(function() { $('#<%= txtInHomeDate.ClientID %>').datepicker({ beforeShow: springDate, beforeShowDay: editDays, dateFormat: 'mm/dd/yy', buttonImage: 'images/cal.gif', buttonText: 'Choose date', firstDay: 1, buttonImageOnly: true, showOn: 'both', showAnim: 'fadeIn', onSelect: function() { $(this).trigger("onchange", null); } }); function springDate() { var defaultMin = new Date(); var defaultMax = new Date(); var Min = defaultMin; var Max = defaultMax; // make valid date from hiddenfied value format is MM/dd/yyyy dateMin = $('#<%= hfStDate.ClientID %>').val(); dateMin = new Date(dateMin); dateMax = $('#<%= hfEndDate.ClientID %>').val(); dateMax = new Date(dateMax); if (dateMin && dateMax) { Min = new Date(dateMin.getFullYear(), dateMin.getMonth(), dateMin.getDate()); Max = new Date(dateMax.getFullYear(), dateMax.getMonth(), dateMax.getDate()); } return { minDate: Min, maxDate: Max }; } }); } <.... <asp:TemplateField HeaderText="In-Home Date"> <ItemStyle HorizontalAlign="Center" /> <ItemTemplate> <asp:HiddenField ID="hfStDate" runat="server" Value="09/01/2011" /> <asp:HiddenField ID="hfEndDate" runat="server" Value="11/30/2011" /> <asp:TextBox ID="txtInHomeDate" runat="server" /> </ItemTemplate> </asp:TemplateField> Currently, it errors out since the jquery function won't find the txtInHomeDate. Could I get some help as I am pretty close to get this done? Thanks!!

    Read the article

  • change maxlength depending of the option selected

    - by tuner3000
    I've seen similar questions posted and tried to change them to meet my needs but I don't know enough about javascript to do it. I need that when a user change the dropdown select, the "titre text field" maxlength is dynamically changed a, b c and d max maxlength should be 40 and e maxlength should be 2 my code is below, I don't know why but it is not working correctly: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>title page</title> </head> <body> <script type="text/javascript"> function changeValue(dropdown) { var option = dropdown.options[dropdown.selectedIndex].value, field = document.getElementById('titre'); if (option == 'a' || option == 'b' || option == 'c' || option == 'd') { field.maxLength = 40; } else if (option == 'e') { field.value = field.value.substr(0, 2); // before reducing the maxlength, make sure it contains at most two characters; you could also reset the value altogether field.maxLength = 2; } }? </script> <form action="converter.php" method="post"> <h2>Feel all field below:</h2> <div> Title: <input type="texte" name="titre" id="titre" maxLength="40"/> Format: <select id="format" name="format" onchange="changeValue(this);"> <option value="a">A</option> <option value="b">B</option> <option value="c">C</option> <option value="d">D</option> <option value="e">E</option> </select> </div> <div> <textarea name="texte" style="width: 415px; height: 155px;"></textarea> </div> <div> <input type="submit" value="OK" /> </div> </form> </body> </html>

    Read the article

  • Filter Datagrid onLoad

    - by Morgan Delvanna
    My data grid successfully filters when I select a month from a dropdown list, however when I try to filter it onLoad it just doesn't filter. The dropdown successfully displays the current month, and the grid should also show the current month data. <script type="text/javascript"> dojo.require("dojox.grid.DataGrid"); dojo.require("dojox.data.XmlStore"); dojo.require("dijit.form.FilteringSelect"); dojo.require("dojo.data.ItemFileReadStore"); dojo.require("dojo.date"); theMonth = new Date(); dojo.addOnLoad(function() { dojo.byId('monthInput').value = month_name[(theMonth.getMonth()+1)]; var filterString='{month: "' + theMonth.getMonth() + '"}'; var filterObject=eval('('+filterString+')'); dijit.byId("eventGrid").filter(filterObject); } ); var eventStore = new dojox.data.XmlStore({url: "events.xml", rootItem: "event", keyAttribute: "dateSort"}); function monthClick() { var ctr, test, rtrn; test = dojo.byId('monthInput').value; for (ctr=0;ctr<=11;ctr++) { if (test==month_name[ctr]) { rtrn = ctr; } } var filterString='{month: "' + rtrn + '"}'; var filterObject=eval('('+filterString+')'); eventGrid.setQuery(filterObject); } </script> </head> <body class="tundra"> <div id="header" dojoType="dijit.layout.ContentPane" region="top" class="pfga"></div> <div id="menu" dojoType="dijit.layout.ContentPane" region="left" class="pfga"></div> <div id="content" style="width:750px; overflow:visible" dojoType="dijit.layout.ContentPane" region="center" class="pfga"> <div dojotype="dojo.data.ItemFileReadStore" url="months.json" jsID="monthStore"></div> <div id="pagehead" class="Heading1" >Upcoming Events</div> <p> <input dojoType="dijit.form.FilteringSelect" store="monthStore" searchAttr="month" name="id" id="monthInput" class="pfga" onChange="monthClick()" /> </p> <table dojoType="dojox.grid.DataGrid" store="eventStore" class="pfga" style="height:500px; width:698px" clientSort="true" jsID="eventGrid"> <thead> <tr> <th field="date" width="80px">Date</th> <th field="description" width="600px">Description</th> </tr> <tr> <th field="time" colspan="2">Details</th> </tr> </thead> </table> </div> <div id="footer"></div>

    Read the article

  • Why does this work in Firefox but not IE and how can I fix it?

    - by bstullkid
    I want to show and hide rows of a table based on the value of a select box and this works in Firefox but not IE: <select onChange="javascript: toggle(this.value);"> <option value="cat0">category 0</option> <option value="cat1">category 1</option> </select> <table> <tr name="cat0"> <td>some stuff v</td> <td>some stuff v</td> </tr> <tr name="cat0"> <td>some stuff d</td> <td>some stuff d</td> </tr> <tr name="cat1"> <td>some stuff a</td> <td>some stuff a</td> </tr> <tr name="cat1"> <td>some stuff b</td> <td>some stuff b</td> </tr> </table> <script type="text/javascript"> function toggle(category) { // turn everything off for (var i = 0; i < 2; i++) { var cat = document.getElementsByName('cat' + i); for (var j = 0; j < cat.length; j++) cat[j].style.display = 'none'; } // turn on category chosen var cat = document.getElementsByName(category); for (var i = 0; i < cat.length; i++) cat[i].style.display = ''; } // start by showing cat0 toggle('cat0'); </script>

    Read the article

  • How to unset an ajax loading.

    - by metacortex
    Hi, I have this script which loads external content: <script type="text/javascript"> var http_request = false; function makePOSTRequest(url, parameters) { http_request = false; if (window.XMLHttpRequest) { http_request = new XMLHttpRequest(); if (http_request.overrideMimeType) { http_request.overrideMimeType('text/html'); } } else if (window.ActiveXObject) { try { http_request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { http_request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {} } } if (!http_request) { alert('Cannot create XMLHTTP instance'); return false; } http_request.onreadystatechange = alertContents; http_request.open('POST', url, true); http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); http_request.setRequestHeader("Content-length", parameters.length); http_request.setRequestHeader("Connection", "close"); http_request.send(parameters); } function alertContents() { if (http_request.readyState == 4) { if (http_request.status == 200) { result = http_request.responseText; document.getElementById('opciones').innerHTML = result; } else { alert('Hubo un problema con la operación.'); } } } function get(obj) { var poststr = "port_post=" + encodeURI( document.getElementById("port-post").value ); makePOSTRequest('http://www.site.com/inc/metaform.php?opcion='+ encodeURI( document.getElementById("port-post").value ), poststr); } </script> This is the select that retrieves the content: <select name="port_post" id="port-post" onchange="get(this.parentNode);"> <option value="1">Select one...</option> <option value="2">Pear</option> <option value="3">Pineapple</option> </select> And this is the container div: <div id="opciones">Default content</div> All I whish to know is how I can unset the ajax loading when I change the selection to "Select one...". I wish to say, how restoring the Default content once the "Select one..." option is selected.

    Read the article

  • How to send variable to php with ajax?

    - by Dee1983
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <script type="text/javascript"> function load(thediv, thefile) { if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject('Microsoft.XMLHTTP)'); } xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById(thediv) .innerHTML = xmlhttp.responseText; } } xmlhttp.open('GET', thefile, true); xmlhttp.send(); } </script> </head> <body> <?php //connection to db and mysql query $result = mysql_query($query) or die(mysql_error()); $options=""; while ($row=mysql_fetch_array($result)) { $id=$row["idProducts"]; $thing=$row["country"]; $options.="<OPTION VALUE=\"$id\">".$thing.'</option>'; } mysql_close(); ?> <SELECT id="countrySearch" NAME=countrySearch onchange="load('divtest', 'step2.search.php')";> <OPTION VALUE=0>Choose <?=$options?> </SELECT> <div id="divtest"> test </div> </body> step2.search.php consists of: <?php echo "I want it to store the users selection as a variable for php to use"; ?> The problem I have is I want to store what the user selects from the drop down box and use it in php to do a mysql query using the variable from the user select form to form the WHERE part of the mysql statement. Then use ajax to put new data in "divtest". How can I store the user selection into a variable then send it to be used in step2.search.php?

    Read the article

  • Lift session valid ajax callback from a static javascript

    - by ChrisJamesC
    I am currently implementing a graph visualisation tool using lift on the server side and d3 ( a javascript visualisation framework) for all the visualisation. The problem I have is that in the script I want to get session dependent data from the server. So basically, my objective is to write lift-valid ajax callbacks in a static js script. Here is what I tried so far: What I have tried so far If you feel that the best solution is one that I already tried feel free to post a detailed answer telling me how to use it exactly and how it completely solves my problem. REST interface Usually what one would do to get data from a javascript function in lift is to create a REST interface. However this interface will not be linked to any session. This is the solution I got from my previous question: Get json data in d3 from lift snippet Give function as argument of script Another solution would be to give the ajaxcallback as an argument of the main script called to generate my graph. However I expect to have a lot of callbacks and I don't want to have to mess with the arguments of my script. Write the ajax callback in another script using lift and call it from the main script This solution, which is similar to a hidden text input is probably the more likely to work. However it is not elegant and it would mean that I would have to load a lot of scripts on load, which is not really conveniant. Write the whole script in lift and then serve it to the client This solution can be elegant, however my script is very long and I would really prefer that it remainss static. What I want On client side While reviewing the source code of my webpage I found that the callback for an ajaxSelect is: <select onchange="liftAjax.lift_ajaxHandler('F966066257023LYKF4=' + encodeURIComponent(this.value), null, null, null)" name="F96606625703QXTSWU" id="node_delete" class="input"> Moreover, there is a variable containing the state of the page in the end of the webpage: var lift_page = "F96606625700QRXLDO"; So, I am wondering if it is possible to simulate that my ajaxcall is valid using this liftAjax.lift_ajaxHandler function. However I don't know the exact synthax to use. On server side Since I "forged" a request on client side, I would now like to get the request on client side and to dispatch it to the correct function. This is where the LiftRules.dispatch object seems the best solution: when it is called, all the session management has been made (the request is authentified and linked to a session), however I don't know how to write the correct piece of code in the append function. Remark In lift all names of variables are changed to a random string in order to increase the security, I would like to have the same behavior in my application even if that will probably mean that I will have to "give" the javascript these values. However an array of 15 string values is still a better tradeoff than 15 functions as argument of a javascript function.

    Read the article

  • Can I use this Ajax script to communicate and exchange data between client and server?

    - by lala
    This block of code is for client.html (it is located in this www.client.com/client.html) - client side. The I have the code below that goes something like this: ajaxRequest.open("GET", "http://www.server.com/ajax.php", true); This is how I call the file ajax.php located in the server. Unfortunately I have no luck at all. It cannot connect to the server I'm calling. BTW, the ips /test site I've been using are all no restrictions, and is accessible to all. However, I tried to simulate by putting both client.html and ajax.php in same site and it works well. So my question is does this script works only if you are in same site? or does it work also in client-server scenario? What else do I have to do in order to make this work? //client.html <script language="javascript" type="text/javascript"> <!-- //Browser Support Code function ajaxFunction(){ var ajaxRequest; // The variable that makes Ajax possible! try{ // Opera 8.0+, Firefox, Safari ajaxRequest = new XMLHttpRequest(); } catch (e){ // Internet Explorer Browsers try{ ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){ // Something went wrong alert("Your browser broke!"); return false; } } } // Create a function that will receive data sent from the server ajaxRequest.onreadystatechange = function(){ if(ajaxRequest.readyState == 4){ document.myForm.time.value = ajaxRequest.responseText; } } ajaxRequest.open("GET", "http://www.server.com/ajax.php", true); ajaxRequest.send(null); } //--> </script> <form name='myForm'> Name: <input type='text' onChange="ajaxFunction();" name='username' /> <br /> Time: <input type='text' name='time' /> </form> </body> </html> // ajax.php <?php echo date("H:i:s"); ?>

    Read the article

  • Javascript auto calculating with (+) and (-)

    - by Josh
    I need some help finding the error in my javascript calculation. I need to calculate the sum of my input boxes automatically and have my user be able to edit the calculation using + or - buttons. The code I have already does the calculation automatically if you manually enter the numbers, but pressing the + or - does not change the calculation. Here is the code: <html> <head> <script language="javascript"> function Calc(className){ var elements = document.getElementsByClassName(className); var total = 0; for(var i = 0; i < elements.length; ++i){ total += parseInt(elements[i].value); } document.form0.total.value = total; } function addone(field) { field.value = Number(field.value) + 1; } function subtractone(field) { field.value = Number(field.value) - 1; } </script> </head> <body> <form name="form0" id="form0"> 1: <input type="text" name="box1" id="box1" class="add" value="0" onKeyUp="Calc('add')" onChange="updatesum()" onClick="this.focus();this.select();" /> <input type="button" value=" + " onclick="addone(box1);"> <input type="button" value=" - " onclick="subtractone(box1);"> <br /> 2: <input type="text" name="box2" id="box2" class="add" value="0" onKeyUp="Calc('add')" onClick="this.focus();this.select();" /> <input type="button" value=" + " onclick="addone(box2);"> <input type="button" value=" - " onclick="subtractone(box2);"> <br /> 3: <input type="text" name="box3" id="box3" class="add" value="0" onKeyUp="Calc('add')" onClick="this.focus();this.select();" /> <input type="button" value=" + " onclick="addone(box3);"> <input type="button" value=" - " onclick="subtractone(box3);"> <br /> <br /> Total: <input readonly style="border:0px; font-size:14; color:red;" id="total" name="total"> </form> </body></html> Im sure the issue must be small, I just cant put my finger on it.

    Read the article

  • Rails controller not rendering correct view when form is force-submitted by Javascript

    - by whazzmaster
    I'm using Rails with jQuery, and I'm working on a page for a simple site that prints each record to a table. The only editable field for each record is a checkbox. My goal is that every time a checkbox is changed, an ajax request updates that boolean attribute for the record (i.e., no submit button). My view code: <td> <% form_remote_tag :url => admin_update_path, :html => { :id => "form#{lead.id}" } do %> <%= hidden_field :lead, :id, :value => lead.id %> <%= check_box :lead, :contacted, :id => "checkbox"+lead.id.to_s, :checked => lead.contacted, :onchange => "$('#form#{lead.id}').submit();" %> <% end %> </td> In my routes.rb, admin_update_path is defined by map.admin_update 'update', :controller => "admin", :action => "update", :method => :post I also have an RJS template to render back an update. The contents of this file is currently just for testing (I just wanted to see if it worked, this will not be the ultimate functionality on a successful save)... page << "$('#checkbox#{@lead.id}').hide();" When clicked, the ajax request is successfully sent, with the correct params, and the action on the controller can retrieve the record and update it just fine. The problem is that it doesn't send back the JS; it changes the page in the browser and renders the generated Javascript as plain text rather than executing it in-place. Rails does some behind-the-scenes stuff to figure out if the incoming request is an ajax call, and I can't figure out why it's interpreting the incoming request as a regular web request as opposed to an ajax request. I may be missing something extremely simple here, but I've kind-of burned myself out looking so I thought I'd ask for another pair of eyes. Thanks in advance for any info!

    Read the article

  • how to use ajax with json in ruby on rails

    - by rafik860
    I am implemeting a facebook application in rails using facebooker plugin, therefore it is very important to use this architecture if i want to update multiple DOM in my page. if my code works in a regular rails application it would work in my facebook application. i am trying to use ajax to let the user know that the comment was sent, and update the comments bloc. migration: class CreateComments < ActiveRecord::Migration def self.up create_table :comments do |t| t.string :body t.timestamps end end def self.down drop_table :comments end end controller: class CommentsController < ApplicationController def index @comments=Comment.all end def create @comment=Comment.create(params[:comment]) if request.xhr? @comments=Comment.all render :json=>{:ids_to_update=>[:all_comments,:form_message], :all_comments=>render_to_string(:partial=>"comments" ), :form_message=>"Your comment has been added." } else redirect_to comments_url end end end view: <script> function update_count(str,message_id) { len=str.length; if (len < 200) { $(message_id).innerHTML="<span style='color: green'>"+ (200-len)+" remaining</span>"; } else { $(message_id).innerHTML="<span style='color: red'>"+ "Comment too long. Only 200 characters allowed.</span>"; } } function update_multiple(json) { for( var i=0; i<json["ids_to_update"].length; i++ ) { id=json["ids_to_update"][i]; $(id).innerHTML=json[id]; } } </script> <div id="all_comments" > <%= render :partial=>"comments/comments" %> </div> Talk some trash: <br /> <% remote_form_for Comment.new, :url=>comments_url, :success=>"update_multiple(request)" do |f|%> <%= f.text_area :body, :onchange=>"update_count(this.getValue(),'remaining');" , :onkeyup=>"update_count(this.getValue(),'remaining');" %> <br /> <%= f.submit 'Post'%> <% end %> <p id="remaining" >&nbsp;</p> <p id="form_message" >&nbsp;</p> <br><br> <br> if i try to do alert(json) in the first line of the update_multiple function , i got an [object Object]. if i try to do alert(json["ids_to_update"][0]) in the first line of the update_multiple function , there is no dialog box displayed. however the comment got saved but nothing is updated. it seems like the object sent by rails is nil or cant be parsed by JSON.parse(json). questions: 1.how can javascript and rails know that i am dealing with json objects?deos ROR sent it a object format or a text format?how can it check that the json object has been sent 2.how can i see what is the returned json?do i have to parse it?how? 2.how can i debug this problem? 3.how can i get it to work?

    Read the article

  • RedirectToAction help: or better suggestion

    - by Dean Lunz
    Still getting my feet wet with asp.net mvc. I have a working Action and httppost action but I want to replace the "iffy" code with a RedirectToAction call because the code is rather large for what it does. A call using RedirectToAction would clean it up more. Every way I've tried it fails to work for me in that the drop down list fails to have the proper item selected. The code below works fine but calling RedirectToAction the was I have been does not work for me. So how can i rework the code below to use RedirectToAction ? I find this line of code particularly troubling because there is no garentee that the "this.Url.RequestContext.RouteData.Route" property will be of type "System.Web.Routing.Route". // get url request var urlValue = "/" + ((System.Web.Routing.Route)(this.Url.RequestContext.RouteData.Route)).Url; I also find the second piece of code rather bloated ... // build the url template urlValue = urlValue.Replace("{realm}", realm); urlValue = urlValue.Replace("{guild}", guild); urlValue = urlValue.Replace("{date}", date.ToShortDateString().Replace("/", "-")); urlValue = urlValue.Replace("{pageIndex}", pageIndex.ToString()); urlValue = urlValue.Replace("{itemCount}", itemCountToDisplay.ToString()); The route I have setup is routes.MapRoute( "GuildOverview Realm", // Route name "GuildMembers/{realm}/{guild}/{date}/{pageIndex}/{itemCount}", // URL with parameters new { controller = "GuildMembers", action = "Index" }); // Parameter defaults The code for my controller actions is below ... [HttpPost] public ActionResult Index(string realm, string guild, DateTime date, int pageIndex, int itemCount, FormCollection formCollection) { // get form data if it's there and try parse num items to display var cnt = this.Request.Form["ddlDisplayCount"]; int itemCountToDisplay = 10; if (!string.IsNullOrEmpty(cnt)) int.TryParse(cnt, out itemCountToDisplay); // get url request var urlValue = "/" + ((System.Web.Routing.Route)(this.Url.RequestContext.RouteData.Route)).Url; // build the url template urlValue = urlValue.Replace("{realm}", realm); urlValue = urlValue.Replace("{guild}", guild); urlValue = urlValue.Replace("{date}", date.ToShortDateString().Replace("/", "-")); urlValue = urlValue.Replace("{pageIndex}", pageIndex.ToString()); urlValue = urlValue.Replace("{itemCount}", itemCountToDisplay.ToString()); return this.Redirect(urlValue); } public ActionResult Index(string realm, string guild, DateTime date, int pageIndex, int itemCount) { // get the page index ViewData["pageIndex"] = pageIndex; // validate item count var pageItemCountItems = new[] { 10, 20, 50, 100 }; if (!pageItemCountItems.Contains(itemCount)) itemCount = pageItemCountItems[0]; // calc the number of pages there are var numPages = (this._repository.GetGuildMemberCount(date, realm, guild) / itemCount) + 1; this.ViewData["pageCount"] = numPages; // get url request var urlValue = "/" + ((System.Web.Routing.Route)(this.Url.RequestContext.RouteData.Route)).Url; // build the url template urlValue = urlValue.Replace("{realm}", realm); urlValue = urlValue.Replace("{guild}", guild); urlValue = urlValue.Replace("{date}", date.ToShortDateString().Replace("/", "-")); urlValue = urlValue.Replace("{pageIndex}", "{0}"); urlValue = urlValue.Replace("{itemCount}", itemCount.ToString()); // set url template ViewData["UrlTemplate"] = urlValue; // set list of items for the display count dropdown var itemCounts = new SelectList(pageItemCountItems, itemCount); ViewData["DisplayCount"] = itemCounts; return View(_repository.GetGuildCharacters(date, realm, guild, (pageIndex - 1) * itemCount, itemCount)); } and my Index view contains the fallowing <%=Html.SimplePager(int.Parse(ViewData["pageIndex"].ToString()), int.Parse(ViewData["pageCount"].ToString()), ViewData["urlTemplate"].ToString(), "nav-menu")%> <% using (Html.BeginForm()) { %> <%= Html.DropDownList("ddlDisplayCount", (SelectList)ViewData["DisplayCount"], new { onchange = "this.form.submit();" })%> <% }%>

    Read the article

  • Apply jquery selectbox style on chained selectbox

    - by ktsixit
    Hi all, I have created a pair of chained selectboxes in my page. The second selectbox is filled with a set of values, depending on the first box's selected value. The script that makes the two selectboxes work like this, uses php and javascript. This is the code I'm using: form <select name="continent" tabindex="1" onChange="getCountry(this.value)"> <option value="#">-Select-</option> <option value="Europe">Europe</option> <option value="Asia">Asia</option> </select> <div id="countrydiv"> <select name="country" tabindex="2"> <option></option> </select> </div> <input type="submit" /> </form> javascript code $(document).ready(function() { $('select[name="continent"]').selectbox({debug: true}); $('select[name="country"]').selectbox({debug: true}); }); function getXMLHTTP() { //fuction to return the xml http object var xmlhttp=false; try{ xmlhttp=new XMLHttpRequest(); } catch(e) { try{ xmlhttp= new ActiveXObject("Microsoft.XMLHTTP"); } catch(e){ try{ xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e1){ xmlhttp=false; } } } return xmlhttp; } function getCountry(continentId) { var strURL="findCountry.php?continent="+continentId; var req = getXMLHTTP(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { // only if "OK" if (req.status == 200) { document.getElementById('countrydiv').innerHTML=req.responseText; } else { alert("There was a problem while using XMLHTTP:\n" + req.statusText); } } } req.open("GET", strURL, true); req.send(null); } } php code (findCountry.php) <? $continent=intval($_GET['continent']); if ($_GET['continent'] == 'Europe') { ?> <select name="country"> <option value="France">France</option> <option value="Germany">Germany</option> <option value="Spain">Spain</option> <option value="Italy">Italy</option> </select> <? } if ($_GET['continent'] == 'Asia') { ?> <select name="country"> <option value="China">China</option> <option value="India">India</option> <option value="Japan">Japan</option> </select> <? } ?> What I want to do is to apply jquery selectbox styling on these selectboxes. I haven't succeeded in doing that yet. The problem is that jquery is hiding the normal selectbox and is replacing it with a list. Furthermore, after selectbox's content is refreshed, jquery cannot re-construct it into a list. You can take a look of the jquery code here Is there something I can do to combine these techniques? I have tried a million things but nothing worked. Can you please help me?

    Read the article

  • Invalid assignment left hand side

    - by JoelM
    I'm getting an invalid assignment left hand side. What I'm trying to do is, to use jscolor http://jscolor.com to define the color of polygons im drawing via Mapbender http://mapbender.org. What I do: Select a polygon by clicking on it, then open the options dialog (seperate window) where I have several options including the color. MyCode: if (isTransactional) {str += "\t\t<tr>\n"; var options = ["insert", "update", "delete", "abort", "pick"]; for (var i = 0 ; i < options.length ; i++) { var onClickText = "this.disabled=true;var result = window.opener.formCorrect(document, '"+featureTypeElementFormId+"');"; onClickText += "if (result.isCorrect) {"; onClickText += "window.opener.dbGeom('"+options[i]+"', "+memberIndex+"); "; // onClickText += "window.close();"; onClickText += "}"; onClickText += "else {"; onClickText += "alert(result.errorMessage);this.disabled=false;" onClickText += "}"; if (options[i] == "insert" && hasGeometryColumn && (!fid || showSaveButtonForExistingGeometries)) { str += "\t\t\t<td><input type='button' name='saveButton' value='"+msgObj.buttonLabelSaveGeometry+"' onclick=\""+onClickText+"\" /></td>\n"; } if (!featureTypeMismatch && fid) { if (options[i] == "update" && hasGeometryColumn) { str += "\t\t\t<td><input type='button' name='updateButton' value='"+msgObj.buttonLabelUpdateGeometry+"' onclick=\""+onClickText+"\"/></td>\n"; } if (options[i] == "delete"){ var deleteOnClickText = "var deltrans = confirm('"+msgObj.messageConfirmDeleteGeomFromDb+"');"; deleteOnClickText += "if (deltrans){"; deleteOnClickText += onClickText + "}"; str += "\t\t\t<td><input type='button' name='deleteButton' value='"+msgObj.buttonLabelDeleteGeometry+"' onclick=\""+deleteOnClickText+"\"/></td>\n"; }} if (options[i] == "abort") { str += "\t\t\t<td><input type='button' name='abortButton' value='"+msgObj.buttonLabelAbort+"' onclick=\"window.close();\" /></td>\n"; } if (options[i] == "pick") { var color; str += "<td><input class='color' name='color' id='cPick' onchange="+color+"></td>"; str += "<td><input type='text' id='text' value="+color+"></td>"; //color = document.getElementById('cPick').value; //var color2 = color; //alert(color2); } }str += "\t\t</tr>\n";}str += "\t</table>\n";str += "<input type='hidden' id='fid' value='"+fid+"'>"; //str += "<input type='text' name='mb_wfs_conf'>"; str += "</form>\n";}return str;} The Application: It is a Mapbender application to display maps and draw on it. You can draw points, lines and polygons also merge and split them. You can also select the polygons that you have drawn to alter them. Using: PHP, JavaScript, HTML, CSS, Mapbender, jQuery, Geoserver, PostgreSQL, WMS, WFS-T Sorry guys, but I think I'm wasting your time. Will ask this question in GIS specified Q&A. Thank you for the input. Greetings Joël

    Read the article

  • Exception thrown while accessing HTML DataTable in backing bean

    - by Denzil
    Hi folks, I am building a simple application in JSF with the CrUD functionality. I am trying to implement edit functionality using the tomahawk component .I am unable to retrieve the selected row in my backing bean. Here's my JSP file snip: <t:dataTable id="data" binding="#{selectOneRowList.dataTable}" styleClass="scrollerTable" headerClass="standardTable_Header" footerClass="standardTable_Header" rowClasses="standardTable_Row1,standardTable_Row2" columnClasses="standardTable_Column,standardTable_ColumnCentered,standardTable_Column" var="car" value="#{selectOneRowList.list}" sortColumn="#{selectOneRowList.sortColumn}" sortAscending="#{selectOneRowList.sortAscending}" preserveDataModel="false" preserveSort="true" preserveRowStates="true" rows="10" > <h:column> <f:facet name="header"> <h:outputText value="Select"/> </f:facet> <t:selectOneRow groupName="selection" id="hugo" value="#{selectOneRowList.selectedRowIndex}" onchange="submit();" immediate="true" valueChangeListener="#{selectOneRowList.processRowSelection}"/> </h:column> <h:column> <f:facet name="header"> </f:facet> <h:outputText value="#{car.id}" /> </h:column> <h:column> <f:facet name="header"> <h:outputText value="Cars" /> </f:facet> <h:outputText value="#{car.type}" /> </h:column> <t:column sortable="true"> <f:facet name="header"> <h:outputText value="Color" /> </f:facet> <h:outputText value="#{car.color}" /> </t:column> </t:dataTable> Here's my backing bean SelectOneRowList.java : public void editCar(ActionEvent event) { System.out.println("Row number ## " + _selectedRowIndex.toString() + " selected!"); System.out.println("Datatable ::"+ dataTable); System.out.println("Row Count ::" + dataTable.getRowCount()); dataItem = (SimpleCar) getDataTable().getRowData(); //selectedCar = (SimpleCar) _list.get(Integer.parseInt(_selectedRowIndex.toString())); selectedCar = (SimpleCar) dataTable.getRowData(); System.out.println(dataTable.getRowData()); } My DTO{Data Transfer Object} which is SimpleCar.java contains the variables ID, type, color and their respective setters/getters. The dataItem variable is of type "SimpleCar". The dataTable is of type HTMLDataTable. I am able to get the the first 3 SOP's but the 4th SOP isn't printed. I receive the following exception on the server : javax.faces.el.EvaluationException: Exception while invoking expression #{selectOneRowList.editCar} org.apache.myfaces.el.MethodBindingImpl.invoke(MethodBindingImpl.java:156) javax.faces.component.UICommand.broadcast(UICommand.java:89) javax.faces.component.UIViewRoot._broadcastForPhase(UIViewRoot.java:97) javax.faces.component.UIViewRoot.processApplication(UIViewRoot.java:171) org.apache.myfaces.lifecycle.InvokeApplicationExecutor.execute(InvokeApplicationExecutor.java:32) org.apache.myfaces.lifecycle.LifecycleImpl.executePhase(LifecycleImpl.java:95) org.apache.myfaces.lifecycle.LifecycleImpl.execute(LifecycleImpl.java:70) javax.faces.webapp.FacesServlet.service(FacesServlet.java:139) org.apache.myfaces.webapp.filter.ExtensionsFilter.doFilter(ExtensionsFilter.java:341) On click of the edit button the editCar method in my backing bean is invoked. I need to get the data of the selected row in my backing bean. Why is the exception occurring ? The above example is taken from the tomawhawk examples WAR distributed on the website. I have gone through many links including the ones on BalusC but none of them have helped. Regards,

    Read the article

  • Sending two arrays using ajax post request

    - by sachin taware
    I am working on a filter functionality using ajax/jquery and php/mysql.I have two sets of check boxes 1)=for Regions 2)=for Localities.The filter is similar to the one here http://www.proptiger.com/property-in-pune-real-estate.php I want to send the values of both the check boxes to filter the records.The filter for localities will be locally filtered on the selection of a region check box.I have got it to work upto some extent This is called on the first set of check boxes. Html <div class="locality"> <input type="checkbox" id="checkbox1" class="checkbox1" value="<?php echo $suburb['suburb_name']?>" name="Suburb_check[]" onClick="changeResults();" onChange="" ><?php echo $suburb['suburb_name']?> <span class="grey">(<?php echo $suburb['total']?>)</span> </div> <?php }?> Javascript/Jquery function changeResults(){ var data = { 'venue[]' : []}; $("input:checked").each(function() { var chck1 = $(this).val(); //alert(chck1); data['venue[]'].push($(this).val()); }); $.ajax({ type : 'POST', url : 'process.php', data : data, success : function(data){ $('#project_section').html(data); // replace the contents coming from php file } }); $.ajax({ type : 'POST', url : 'loadLocality.php', data : data, success : function(data){ document.getElementById("searchLoader").style.display = 'block'; $('#localityList').html(data); // replace the contents coming from php file // alert(data); document.getElementById("searchLoader").style.display = 'none'; } }); } This is the second set of chck boxes with Localities <div class="locality" id="localities"> <input type="checkbox" onClick="changeLocality();" id="1" value="<?php echo $locality['locality_name'];?>" name="Locality_check[]"><?php echo $locality['locality_name'];?> <span class="grey">(<?php echo $locality['total'];?>)</span> </div> I have called a function similar to the above one and posted it to a different page. Here is the second chck box function: function changeLocality(){ var dataLocality = {'locality[]' : []}; $("input:checked").each(function() { var chcklocal = $(this).val(); //alert(chcklocal); dataLocality['locality[]'].push($(this).val()); }); $.ajax({ type : 'POST', url : 'processLocality.php', data : dataLocality, success : function(dataLocality){ // document.getElementById("newloader").style.display ="block"; $('#project_section').html(dataLocality); // replace the contents coming from php file //alert('data'); // document.getElementById("newloader").style.display ="none"; } }); } But,when I select a region box and then a locality box and then deselect the region,I also get the previous locality value in the region array(name of the array is venue)I want only regions to go in the venue array and regions+localities in the locality array.Actually,if I deselect the region subsequent locality value should also be removed from the array.Also,eventhough I am posting them to different pages the region page holds the locality values.I am stuck as not much of JQUERY knowledge. Went through posts,but was not able to fix it.Any help would be appreciated. EDIT I get an array when I check the first set of chck boxes,and also filter the records using above functions. Array ( [venue] => Array ( [0] => Pune East [1] => Pune West [2] => Pune North [3] => Pune South ) )

    Read the article

  • Dropdown dependent values to be fetch from multiple models using ajax in Yii

    - by newuser
    I searched all the documentation over Yii but not got the answer of it.So I came here finally. I have the following schema Table Schools +------------------+--------------+------+-----+---------------------+----------------+ | Field | Type | Null | Key | Default | Extra | +------------------+--------------+------+-----+---------------------+----------------+ | id | int(10) | NO | PRI | NULL | auto_increment | | school_name | varchar(100) | NO | | | | +------------------+--------------+------+-----+---------------------+----------------+ Table Students +------------------+--------------+------+-----+---------------------+----------------+ | Field | Type | Null | Key | Default | Extra | +------------------+--------------+------+-----+---------------------+----------------+ | id | int(10) | NO | PRI | NULL | auto_increment | | school_id | int(10) | NO | FK | | | | student_name | varchar(100) | NO | | | | | roll_no | varchar(80) | NO | | | | | class | varchar(20) | NO | | | | | | subjects | varchar(100) | NO | | | | +------------------+--------------+------+-----+---------------------+----------------+ I have made models and CRUD for the both models.In models my relation is like this In Students.php the relation is like public function relations() { // NOTE: you may need to adjust the relation name and the related // class name for the relations automatically generated below. return array( 'School' => array(self::BELONGS_TO,'Schools','school_id'), ); } In Schools.php the relation is like public function relations() { // NOTE: you may need to adjust the relation name and the related // class name for the relations automatically generated below. return array( 'student' => array(self::HAS_MANY, 'Students', 'school_id'), ); } Now I made the two models rendered in a single page so that I can enter all the respective fields in a single form. In the _form.php file of Students I have made some change in student_name like this <div class="row"> <?php echo $form->labelEx($model,'student_name'); ?> <?php echo $form->dropdownList($model,'student_name', CHtml::listData(Students::model()->findAll(), 'id', 'student_name'), array('empty'=>array('Select'=>'--Select One---'))); ?> <?php echo $form->error($model,'student_name'); ?> Now for this piece of code I got all the student name from the Student model. So my problem is when I am getting the student name from the dropdown list and going to select a student it will also fetch all the respective values of the student to be rendered in the _form.php without click on save button.So that user don't have to put it again manually. I think ajax and json encode will work here but don't know how to make them work here. [Update] Here is StudentsController code public function actionDisCoor() { $model = School::model()->findByPk($_POST['Students']['student_id']); $data=CHtml::listData($data,'id','name'); foreach($data as $value=>$name) { echo CHtml::tag('option',array('value'=>$value),CHtml::encode($name),true); } } Here is _form.php code for Students <div class="row"> <?php echo $form->labelEx($model,'student_name'); ?> <?php $List = CHtml::listData(Students::model()->findAll(), 'id', 'student_name'); ?> <?php echo $form->dropdownList($model,'student_name',$List, array('onChange'=>CHtml::ajax(array( 'url' => CController::createUrl('DisCoor'), 'type' => 'POST', 'update'=>'#school_id', )),'style'=>'width:180px;' ) )?> <?php echo $form->error($model,'student_name'); ?> </div> After all that when I saw in firebug I got the error.Here is the screen shot

    Read the article

  • cascading dropdown value doesn't seem to get posted to my php page?

    - by udaya
    i am using cascading dropdownlist for showing states of a country... I get the country dropdown value but not the state dropdown value.... I am populating state values via ajax... echo $country = $this->input->post('country'); echo $state = $this->input->post('state'); When inspected through firebug it shows all the option values of my state dropdown then why doesn't it get posted? <select onchange="getCity(1,this.value)" name="state"> <option value="0">Select State</option> <option value="1">Andhra Pradesh</option> <option value="2">Arunachal Pradesh</option> <option value="3">Assam</option> <option value="4">Bihar</option> <option value="5">Chandigarh</option> <option value="6">Chhattisgarh</option> <option value="7">Dadra and Nagar Haveli</option> <option value="8">Daman and Diu</option> <option value="9">Delhi</option> <option value="10">Goa</option> <option value="11">Gujarat</option> <option value="12">Haryana</option> <option value="13">Himachal Pradesh</option> <option value="14">Jammu and Kashmir</option> <option value="15">Jharkhand</option> <option value="16">Karnataka</option> <option value="17">Kerala</option> <option value="18">Lakshadweep</option> <option value="19">Madhya Pradesh</option> <option value="20">Maharashtra</option> <option value="21">Manipur</option> <option value="22">Meghalaya</option> <option value="23">Mizoram</option> <option value="24">Nagaland</option> <option value="25">Orissa</option> <option value="26">Puducherry</option> <option value="27">Punjab</option> <option value="28">Rajasthan</option> <option value="29">Sikkim</option> <option value="30">Tamil Nadu</option> <option value="31">Tripura</option> <option value="32">Uttar Pradesh</option> <option value="33">Uttarakhand</option> <option value="34">West Bengal</option> </select>

    Read the article

< Previous Page | 12 13 14 15 16 17 18  | Next Page >