¿Cómo puedo establecer dinámicamente el número de filas en función del valor de un cuadro de entrada?
Estoy tratando de establecer el número de filas que contienen campos de formulario en función del valor de un cuadro de entrada. ¿Cómo puedo lograr esto? Fragmento de código a continuación. Básicamente, quiero iterar el valor en el campo “numpos”. Idealmente, me gustaría que se actualice dinámicamente cuando el usuario escribe un número en el campo numpos.
<tr>
<th>Número de posiciones:</th>
<td colspan="4"><cfinput type="text" name="numpos" required="yes" message="Por favor ingrese el número de posiciones"></cfinput></td>
</tr>
<cfif #mynum#="" neq="" 0="">
<cfloop from="1" to="#mynum#" index="i">
<tr>
<th>Número de personas necesarias:</th>
<th>Descripción de la posición:</th>
<th>Fecha:</th>
<th>Hora de inicio:</th>
<th>Hora final:</th>
</tr>
<tr>
<td><cfinput type="text" name="numpeople"></cfinput></td>
<td><cfinput type="text" name="posdesc"></cfinput></td>
<td><cfinput type="text" name="posdate"></cfinput></td>
<td><cfinput type="text" name="starttime"></cfinput></td>
<td><cfinput type="text" name="endtime"></cfinput></td>
</tr>
</cfloop>
</cfif>
davy.ai
Se puede utilizar la etiqueta
cfajaxproxy
para lograr esto. La etiquetacfajaxproxy
te permite llamar a una función de ColdFusion desde JavaScript. En este caso, puedes crear una función de ColdFusion que tome el valor del campo ‘numpos’ como argumento y luego use uncfloop
para generar el número apropiado de filas con campos de formulario. Luego puedes llamar a esta función desde JavaScript cuando cambie el valor del campo ‘numpos’.Aquí tienes un ejemplo de cómo hacerlo:
Aquí tienes el código de ColdFusion para la función
updateRows
:cfm
<cffunction name="updateRows" access="remote">
<cfargument name="numpos" type="numeric" required="true">
<cfset var="" html="">
<cfif #numpos#="" neq="" 0="">
<cfloop from="1" to="#numpos#" index="i">
<cfset html="html" &=""></cfset><tr><th>Número de personas necesarias:</th><th>Descripción del puesto:</th><th>Fecha:</th><th>Hora de inicio:</th><th>Hora de finalización:</th></tr><tr><td><cfinput type="text" name="numpeople"></cfinput></td><td><cfinput type="text" name="posdesc"></cfinput></td><td><cfinput type="text" name="posdate"></cfinput></td><td><cfinput type="text" name="starttime"></cfinput></td><td><cfinput type="text" name="endtime"></cfinput></td></tr>">
</cfloop>
</cfif>
<cfreturn html="">
</cfreturn></cfset></cfargument></cffunction>